Commit eb739375 authored by Chen Jiping's avatar Chen Jiping

fix:修复表单页面不兼容问题

parent 35300e0c
......@@ -174,120 +174,115 @@
<div nz-row>
<div nz-col [nzSpan]="20" nzOffset="2">
<nz-card nzTitle="内容">
<nz-tabset>
<nz-tab nzTitle="内容-{{j+1}}" *ngFor="let data of item.exercisesArr;let j = index">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="answerIndex">答案顺序</nz-form-label>
<nz-form-control [nzSpan]="6">
<nz-input-number [nzMin]="1" [nzMax]='8' [(ngModel)]="data.answerIndex"
(ngModelChange)="saveIndex(data)">
</nz-input-number>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{j}}.audioUrl">序号音频</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="{{j}}.audioUrl" [audioUrl]="data.audioUrl"
(audioUploaded)="onAudioUploadSuccess($event, data, 'audioUrl')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">图片</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-upload-image-with-preview style="width: 100%" [picUrl]="data.picUrl"
(imageUploaded)="onImageUploadSuccess($event, data, 'picUrl')">
</app-upload-image-with-preview>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="exercises">操作</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" class="add-btn" id="add-btn" (click)="addWord(data, 'wordArr')">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加单词
<nz-card nzTitle="内容-{{j+1}}" *ngFor="let data of item.exercisesArr;let j = index">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="answerIndex">答案顺序</nz-form-label>
<nz-form-control [nzSpan]="6">
<nz-input-number [nzMin]="1" [nzMax]='8' [(ngModel)]="data.answerIndex" (ngModelChange)="saveIndex(data)">
</nz-input-number>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{j}}.audioUrl">序号音频</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="{{j}}.audioUrl" [audioUrl]="data.audioUrl"
(audioUploaded)="onAudioUploadSuccess($event, data, 'audioUrl')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">图片</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-upload-image-with-preview style="width: 100%" [picUrl]="data.picUrl"
(imageUploaded)="onImageUploadSuccess($event, data, 'picUrl')">
</app-upload-image-with-preview>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="exercises">操作</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" class="add-btn" id="add-btn" (click)="addWord(data, 'wordArr')">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加单词
</button>
</nz-form-control>
</nz-form-item>
<div *ngFor="let word of data.wordArr;let m = index" class="card-item" style="padding: 0.5vw;">
<nz-card nzTitle="单词-{{m+1}}">
<nz-form-item>
<button style="margin: 10px;" nz-button nzType="danger" (click)="deleteWord(data, 'wordArr', m)">
<span>删除</span>
</button>
</nz-form-control>
</nz-form-item>
<div *ngFor="let word of data.wordArr;let m = index" class="card-item" style="padding: 0.5vw;">
<nz-card nzTitle="单词-{{m+1}}">
<nz-form-item>
<button style="margin: 10px;" nz-button nzType="danger" (click)="deleteWord(data, 'wordArr', m)">
<span>删除</span>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{m}}.audioUrl">音频</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="{{m}}.audioUrl" [audioUrl]="word.audioUrl"
(audioUploaded)="onAudioUploadSuccess($event, word, 'audioUrl')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">单词拆分</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" class="add-btn" id="add-btn" (click)="addLetter(word, 'letterArr')">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{m}}.audioUrl">音频</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="{{m}}.audioUrl" [audioUrl]="word.audioUrl"
(audioUploaded)="onAudioUploadSuccess($event, word, 'audioUrl')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">单词拆分</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" class="add-btn" id="add-btn"
(click)="addLetter(word, 'letterArr')">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">单词预览</nz-form-label>
<nz-form-control [nzSpan]="18">
<span nz-text>
<div *ngIf="item.skin == 'A'">
<label *ngFor="let letter of word.letterArr;let n = index"
[ngStyle]="{'text-decoration':letter.isFill=='1'?'underline':'none','font-size':'40px'}">{{letter.val}}</label>
</div>
<div *ngIf="item.skin == 'B'">
<label *ngFor="let letter of word.letterArr;let n = index"
[ngStyle]="{'text-decoration':letter.isFill=='1'?'underline':'none','font-size':'40px'}">{{letter.val}}</label>
</div>
</span>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-control [nzOffset]="2" [nzSpan]="16">
<nz-table #lettersTable nzBordered nzTitle="按照单词填空需要进行拆分填写" [nzData]="word.letterArr"
[nzShowPagination]=false>
<thead>
<tr>
<th>序号</th>
<th>字母组合</th>
<th>是否填空</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let row of lettersTable.data;let p = index">
<td>{{ p+1 }}</td>
<td *ngIf="row.isFill == '1'"><input type="text" nz-input placeholder="max length is 1"
[(ngModel)]="row.val" (blur)="save()" maxlength="1"></td>
<td *ngIf="row.isFill == '0'"><input type="text" nz-input placeholder="请录入字母(组合)"
[(ngModel)]="row.val" (blur)="save()"></td>
<td>
<nz-radio-group [(ngModel)]="row.isFill" (ngModelChange)="save()">
<label nz-radio nzValue="1"></label>
<label nz-radio nzValue="0"></label>
</nz-radio-group>
</td>
<td>
<a (click)="delLetter(word, 'letterArr', p)">delete</a>
</td>
</tr>
</tbody>
</nz-table>
</nz-form-control>
</nz-form-item>
</nz-card>
</div>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">单词预览</nz-form-label>
<nz-form-control [nzSpan]="18">
<span nz-text>
<div *ngIf="item.skin == 'A'">
<label *ngFor="let letter of word.letterArr;let n = index"
[ngStyle]="{'text-decoration':letter.isFill=='1'?'underline':'none','font-size':'40px'}">{{letter.val}}</label>
</div>
<div *ngIf="item.skin == 'B'">
<label *ngFor="let letter of word.letterArr;let n = index"
[ngStyle]="{'text-decoration':letter.isFill=='1'?'underline':'none','font-size':'40px'}">{{letter.val}}</label>
</div>
</span>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-control [nzOffset]="2" [nzSpan]="16">
<nz-table #lettersTable nzBordered nzTitle="按照单词填空需要进行拆分填写" [nzData]="word.letterArr"
[nzShowPagination]=false>
<thead>
<tr>
<th>序号</th>
<th>字母组合</th>
<th>是否填空</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let row of lettersTable.data;let p = index">
<td>{{ p+1 }}</td>
<td *ngIf="row.isFill == '1'"><input type="text" nz-input placeholder="max length is 1"
[(ngModel)]="row.val" (blur)="save()" maxlength="1"></td>
<td *ngIf="row.isFill == '0'"><input type="text" nz-input placeholder="请录入字母(组合)"
[(ngModel)]="row.val" (blur)="save()"></td>
<td>
<nz-radio-group [(ngModel)]="row.isFill" (ngModelChange)="save()">
<label nz-radio nzValue="1"></label>
<label nz-radio nzValue="0"></label>
</nz-radio-group>
</td>
<td>
<a (click)="delLetter(word, 'letterArr', p)">delete</a>
</td>
</tr>
</tbody>
</nz-table>
</nz-form-control>
</nz-form-item>
</nz-card>
</div>
</nz-card>
</nz-tab>
</nz-tabset>
</nz-card>
</div>
</div>
......
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