fix(module:sf): fix missing title (#259)

- issues #258

packages/form/src/sf-item-wrap.component.ts

@@ -7,8 +7,8 @@ import { SFUISchemaItem } from './schema/ui';
  template: `
  <nz-form-item [style.width.px]="ui.width">
  <nz-col *ngIf="showTitle" [nzSpan]="ui.spanLabel" class="ant-form-item-label">
- <label *ngIf="schema.title" [attr.for]="id" [class.ant-form-item-required]="ui._required">
- {{ schema.title }}
+ <label *ngIf="t" [attr.for]="id" [class.ant-form-item-required]="ui._required">
+ {{ t }}
  <span class="optional">
  {{ ui.optional }}
  <nz-tooltip *ngIf="ui.optionalHelp" [nzTitle]="ui.optionalHelp">
@@ -33,4 +33,9 @@ export class SFItemWrapComponent {
  @Input() showError: boolean;
  @Input() error: string;
  @Input() showTitle: boolean;
+ @Input() title: string = null;
+
+ get t() {
+ return this.title === null ? this.schema.title : this.title;
+ }
 }

packages/form/src/widgets/checkbox/checkbox.widget.html

@@ -3,10 +3,10 @@
  (click)="onAllChecked($event)">{{ ui.checkAllText || l.checkAllText }}</label>
 </ng-template>
 <sf-item-wrap [id]="id" [schema]="schema" [ui]="ui" [showError]="showError"
- [error]="error" [showTitle]="true">
+ [error]="error" [showTitle]="true" [title]="labelTitle">
  <ng-container *ngIf="data.length === 0">
  <label nz-checkbox [nzDisabled]="disabled" [ngModel]="value" (ngModelChange)="_setValue($event)">
- <span [innerHTML]="title"></span>
+ {{schema.title}}
  <span class="optional">
  {{ ui.optional }}
  <nz-tooltip *ngIf="ui.optionalHelp" [nzTitle]="ui.optionalHelp">

packages/form/src/widgets/checkbox/checkbox.widget.spec.ts

@@ -0,0 +1,61 @@
+import { ComponentFixture } from '@angular/core/testing';
+
+import { builder, TestFormComponent, SFPage } from '../../../spec/base.spec';
+import { SFSchema } from '../../../src/schema/index';
+
+describe('form: widget: checkbox', () => {
+ let fixture: ComponentFixture<TestFormComponent>;
+ let page: SFPage;
+ const widget = 'checkbox';
+ const labelCls = '.ant-form-item-label';
+ const chekcWrapCls = '.ant-checkbox-wrapper';
+
+ beforeEach(() => ({ fixture, page } = builder({ detectChanges: false })));
+
+ it('#working', () => {
+ const s: SFSchema = {
+ properties: { a: { type: 'string', ui: { widget }, default: true } },
+ };
+ page.newSchema(s).checkValue('a', true);
+ });
+
+ it('#visibleIf', () => {
+ const s: SFSchema = {
+ properties: {
+ a: { type: 'string', ui: { widget } },
+ b: { type: 'string', ui: { widget, visibleIf: { a: [true] } } },
+ },
+ };
+ page
+ .newSchema(s)
+ .checkCount(chekcWrapCls, 1)
+ .click(chekcWrapCls)
+ .checkCount(chekcWrapCls, 2);
+ });
+
+ it('should be ingore title when not array data', () => {
+ const title = 'test';
+ const s: SFSchema = {
+ properties: { a: { type: 'string', title, ui: { widget } } },
+ };
+ page
+ .newSchema(s)
+ .checkElText(labelCls, '')
+ .checkElText(chekcWrapCls, title);
+ });
+
+ it('should be show title when is array data', done => {
+ const title = 'test';
+ const s: SFSchema = {
+ properties: {
+ a: { type: 'string', title, ui: { widget }, enum: ['item1', 'item2'] },
+ },
+ };
+ page.newSchema(s);
+ fixture.whenStable().then(() => {
+ page.checkElText(labelCls, title);
+ page.checkElText(chekcWrapCls, 'item1');
+ done();
+ });
+ });
+});

packages/form/src/widgets/checkbox/checkbox.widget.ts

@@ -13,7 +13,7 @@ export class CheckboxWidget extends ControlWidget {
  allChecked = false;
  indeterminate = false;
  grid_span: number;
- title = ``;
+ labelTitle = ``;
 
  get l() {
  return this.formProperty.root.widget.sfComp.locale;
@@ -26,11 +26,7 @@ export class CheckboxWidget extends ControlWidget {
  this.data = list;
  this.allChecked = false;
  this.indeterminate = false;
- this.title = this.schema.title;
-
- if (list.length === 0) {
- this.schema.title = '';
- }
+ this.labelTitle = list.length === 0 ? '' : this.schema.title;
  this.grid_span = this.ui.span && this.ui.span > 0 ? this.ui.span : 0;
 
  this.updateAllChecked();