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

- issues #258
ng-alain · Nov 6, 2018 · b78f38a · b78f38a
1 parent 13a3a21
commit b78f38a
Show file tree

Hide file tree

Showing 4 changed files with 72 additions and 10 deletions.
diff --git a/packages/form/src/sf-item-wrap.component.ts b/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;
+  }
 }
diff --git a/packages/form/src/widgets/checkbox/checkbox.widget.html b/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">

diff --git a/packages/form/src/widgets/checkbox/checkbox.widget.spec.ts b/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();
+    });
+  });
+});
diff --git a/packages/form/src/widgets/checkbox/checkbox.widget.ts b/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();