bbj-screen-widget 2.4.46 → 2.4.47

package/src/lib/button/button.component.ts

@@ -1,137 +0,0 @@
-import { Component, EventEmitter, OnInit } from '@angular/core';
-import { Data, DataOutput, GlobalVarService, Property, TemplateUtil, Widget } from 'bbj-widget-base';
-import { SFOptionalHelp, SFRadioWidgetSchema } from '@delon/form';
-import { of } from 'rxjs';
-import { HttpClient } from '@angular/common/http';
-import { HttpService } from '../shared/service/http.service';
-
-@Component({
-  selector: 'sc-button',
-  templateUrl: './button.component.html',
-  styleUrls: ['./button.component.less'],
-})
-@Widget('按钮', { group: 'component', image: 'assets/img/screen/myButton.png', icon: 'iconmokuai' })
-export class ButtonComponent implements OnInit {
-  textStyle: any = {};
-  edit: any;
-  @Property('按钮样式', {
-    ui: {
-      widget: 'myButton',
-      spanLabel: 24,
-      spanControl: 24,
-      name: 'button',
-      reset: ['background', 'borderColor'],
-      background: [
-        { background: '#FFB700', borderColor: '#FFB700' },
-        { background: '#00E371', borderColor: '#00E371' },
-        { background: '#3285FF', borderColor: '#3285FF' },
-        { background: '#B232FF', borderColor: '#B232FF' },
-        { background: '#FF3286', borderColor: '#FF3286' },
-        { background: '#FF3832', borderColor: '#FF3832' },
-        { background: 'linear-gradient(-180deg, #FAD961 0%, #F76B1C 100%)', borderColor: '#F76B1C' },
-        { background: 'linear-gradient(-180deg, #B4EC51 0%, #429321 100%)', borderColor: '#429321' },
-        { background: 'linear-gradient(-180deg, #20C8FF 0%, #0059DD 100%)', borderColor: '#0059DD' },
-        { background: 'linear-gradient(-90deg, #3023AE 0%, #C86DD7 87%)', borderColor: '#C86DD7' },
-      ],
-    },
-  })
-  colorExample: any;
-  @Property('内容')
-  title = 'button';
-  @Property('填充', {
-    ui: {
-      widget: 'myColor',
-      example: ['#D0021B', '#F5A623', '#F8E71C', '#50E3C2', '#3285FF', '#B45FFF', '#9B9B9B', null],
-    },
-  })
-  background = 'linear-gradient(-180deg, #20C8FF 0%, #0059DD 100%)';
-  @Property('边框', {
-    ui: {
-      widget: 'myColor',
-      example: ['#FFFFFF', '#F5A623', '#F8E71C', '#50E3C2', '#3285FF', '#B45FFF', '#9B9B9B', null],
-    },
-  })
-  borderColor = '#0059DD';
-  @Property('字体', { ui: { widget: 'myFont' } })
-  font: any = { family: '', color: '#ffffff', weight: 'normal', size: 12, space: 0, lineHeight: '' };
-  @Property('透明度', { ui: { widget: 'myRange', min: 0, max: 1, step: 0.1 } })
-  opacity = 1;
-  @Property('圆角', { ui: { widget: 'myRange', min: 0, max: 100, step: 1 } })
-  radius = 4;
-  @Property('阴影', { ui: { widget: 'myShadow' } })
-  shadow: any = { color: '', X: 0, Y: 0, Z: 0 };
-  @Property('超链接')
-  href = '';
-  @Property('另起窗口', {
-    type: 'boolean',
-    ui: {
-      checkedChildren: '是',
-      unCheckedChildren: '否',
-    },
-  })
-  openModel = true;
-  @Property('执行脚本', {
-    ui: {
-      widget: 'textarea',
-      autosize: { minRows: 6, maxRows: 10 },
-      optionalHelp: {
-        text: `内置变量：
-1、http:用于发起http请求
-2、global:全局变量
-例:http.post("http://www.xxx.com/xxx",{a:global.a});// POST,body传参
-   http.post("http://www.xxx.com/xxx",null,{params:{a:global.a}});// POST,url传参
-   http.get("http://www.xxx.com/xxx",{params:{a:global.a}});// GET,url传参
-`,
-        overlayStyle: {
-          whiteSpace: 'pre-line',
-        },
-      },
-    },
-  })
-  script: string;
-  @Data({
-    properties: {
-      value: { type: 'string', title: '值' },
-    },
-  })
-  data: any[] = [];
-  @DataOutput('值')
-  valueOutput = new EventEmitter<string>();
-  constructor(private http: HttpService, private gloabl: GlobalVarService) {}
-
-  ngOnInit() {
-    this.textStyle = {
-      background: this.background,
-      borderColor: this.borderColor,
-      fontSize: this.font.size + 'px',
-      fontFamily: this.font.family,
-      color: this.font.color,
-      fontWeight: this.font.weight,
-      letterSpacing: this.font.space + 'px',
-      lineHeight: this.font.lineHeight + 'px',
-      opacity: this.opacity,
-      borderRadius: this.radius + '%',
-      boxShadow: this.shadow.color + ' ' + this.shadow.X + 'px ' + this.shadow.Y + 'px ' + this.shadow.Z + 'px',
-    };
-  }
-  openPage(event) {
-    if (!this.edit) {
-      if (this.href) {
-        if (this.openModel) {
-          window.open(this.href, '_blank');
-        } else {
-          window.location.href = this.href;
-        }
-      }
-      if (this.script) {
-        const fn = new Function('http', 'global', this.script);
-        fn(this.http, this.gloabl.data);
-      }
-    }
-    if (this.data?.length) {
-      this.valueOutput.emit(this.data[0].value);
-    }else{
-      this.valueOutput.emit(null);
-    }
-  }
-}

package/src/lib/button/button.module.ts

@@ -1,16 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ButtonComponent } from './button.component';
-import { WidgetBaseModule, WidgetService } from 'bbj-widget-base';
-import { HttpService } from '../shared/service/http.service';
-
-@NgModule({
-  declarations: [ButtonComponent],
-  imports: [CommonModule, WidgetBaseModule],
-  providers: [HttpService],
-})
-export class ButtonModule {
-  constructor(widgetService: WidgetService) {
-    widgetService.register(ButtonComponent);
-  }
-}

package/src/lib/calendar/calendar.component.html

@@ -1 +0,0 @@
-<full-calendar *ngIf="calendarOptions" [options]="calendarOptions"></full-calendar>

package/src/lib/calendar/calendar.component.less

@@ -1,14 +0,0 @@
-:host ::ng-deep {
-  .fc-direction-ltr {
-    height: 100%;
-  }
-  .fc .fc-view-harness {
-    padding-bottom: 0 !important;
-  }
-  .fc-license-message {
-    display: none;
-  }
-  .fc-daygrid-event {
-    white-space: normal;
-  }
-}

package/src/lib/calendar/calendar.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-
-import { CalendarComponent } from './calendar.component';
-
-describe('CalendarComponent', () => {
-  let component: CalendarComponent;
-  let fixture: ComponentFixture<CalendarComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [ CalendarComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(CalendarComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/calendar/calendar.component.ts

@@ -1,75 +0,0 @@
-import { Component, OnInit, ViewChild, OnChanges, SimpleChanges, EventEmitter } from '@angular/core';
-import { Widget, Property, Data, DataOutput } from 'bbj-widget-base';
-import { CalendarOptions, FullCalendarComponent } from '@fullcalendar/angular';
-import { deepCopy } from '@delon/util';
-import { Router } from '@angular/router';
-
-@Component({
-  selector: 'sc-calendar',
-  templateUrl: './calendar.component.html',
-  styleUrls: ['./calendar.component.less'],
-})
-@Widget('日历', { group: 'component', image: 'assets/img/screen/rili.png', icon: 'iconmokuai' })
-export class CalendarComponent implements OnInit, OnChanges {
-  @Property('是否自定义初始日期', { ui: { format: 'date', widget: 'checkbox', spanLabel: 0, spanControl: 24 } })
-  isInitialDate = true;
-  @Property('', { ui: { type: 'date', format: 'date', spanLabel: 0, spanControl: 24 } })
-  initialDate = '2020-07-18';
-  @Data({
-    properties: {
-      id: { type: 'string', title: 'id' },
-      start: { type: 'string', title: '开始日期' },
-      end: { type: 'string', title: '结束日期' },
-      title: { type: 'string', title: '内容' },
-    },
-  })
-  data: any[] = [
-    { end: '2020-07-21 00:00:00', start: '2020-07-19 00:00:00', title: 'event 3' },
-    { end: '2020-07-19 00:00:00', start: '2020-07-18 00:00:00', title: 'event 4' },
-    { end: '2020-07-22', start: '2020-07-20', title: 'event 5' },
-  ];
-  @DataOutput(['id', 'title'])
-  dataClick = new EventEmitter<any>();
-
-  constructor(private router: Router) {}
-  calendarOptions: CalendarOptions;
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes.data) {
-      // const events = this.data.map((item) => ({
-      //   id: item.id,
-      //   start: item.start.indexOf(' 00:00:00') > -1 ? item.start.split(' ')[0] : item.start,
-      //   end: item.end.indexOf(' 00:00:00') > -1 ? item.end.split(' ')[0] : item.end,
-      //   title: item.title,
-      // }));
-      this.calendarOptions = {
-        headerToolbar: {
-          left: 'prev,next today',
-          center: 'title',
-          right: 'timeGridDay,timeGridWeek,dayGridMonth',
-        },
-        buttonText: {
-          dayGridMonth: '月',
-          timeGridWeek: '周',
-          timeGridDay: '日',
-          today: '今日',
-        },
-        timeZone: 'local',
-        initialDate: this.isInitialDate ? this.initialDate : null,
-        events: this.data,
-        locale: 'zh',
-        eventTimeFormat: {
-          hour: 'numeric',
-          minute: '2-digit',
-          hour12: false,
-        },
-        slotLabelFormat: { hour: 'numeric', minute: '2-digit', hour12: false },
-        eventClick: (info) => {
-          info.jsEvent.preventDefault();
-          this.dataClick.emit({ id: info.event.id, title: info.event.title });
-        },
-      };
-    }
-  }
-  ngOnInit(): void {}
-}

package/src/lib/calendar/calendar.module.ts

@@ -1,23 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { WidgetBaseModule, WidgetService } from 'bbj-widget-base';
-import { CalendarComponent } from './calendar.component';
-import { FullCalendarModule } from '@fullcalendar/angular';
-import dayGridPlugin from '@fullcalendar/daygrid'; // a plugin
-import timeGridPlugin from '@fullcalendar/timegrid'; // a plugin
-import interactionPlugin from '@fullcalendar/interaction'; // a plugin
-
-@NgModule({
-  declarations: [CalendarComponent],
-  imports: [CommonModule, WidgetBaseModule, FullCalendarModule],
-})
-export class CalendarModule {
-  constructor(widgetService: WidgetService) {
-    FullCalendarModule.registerPlugins([
-      dayGridPlugin,
-      timeGridPlugin,
-      interactionPlugin,
-    ]);
-    widgetService.register(CalendarComponent);
-  }
-}

package/src/lib/checkbox/checkbox.component.html

@@ -1,61 +0,0 @@
-<ng-container *ngIf="!isCustom">
-  <div class="checkboxDefault" [class.label-vertical]="lableLayout === 'vertical'">
-    <label
-      *ngIf="showCheckAll"
-      nz-checkbox
-      [ngStyle]="textStyle"
-      [style.padding]="lablePadd"
-      [style.width]="labelWidth"
-      [(ngModel)]="allChecked"
-      (ngModelChange)="updateAllChecked()"
-      [nzIndeterminate]="indeterminate"
-    >
-      <ng-container *ngIf="!hiddenLabel">全选</ng-container>
-    </label>
-    <nz-checkbox-wrapper [ngStyle]="textStyle" (nzOnChange)="change($event)">
-      <label
-        *ngFor="let option of checkOptions"
-        nz-checkbox
-        [nzDisabled]="disabled"
-        [style.padding]="lablePadd"
-        [style.width]="labelWidth"
-        [nzValue]="option.value"
-        [(ngModel)]="option.checked"
-        [style.color]="option.color"
-      >
-        <ng-container *ngIf="!hiddenLabel">{{ option.label }}</ng-container>
-      </label>
-    </nz-checkbox-wrapper>
-  </div>
-</ng-container>
-<ng-container *ngIf="isCustom">
-  <div
-    class="content"
-    [class.layout-vertical]="layout === 'vertical'"
-    [class.label-vertical]="lableLayout === 'vertical'"
-    [ngStyle]="textStyle"
-  >
-    <label
-      *ngIf="showCheckAll"
-      class="customRadio"
-      [class.checked]="allChecked && !indeterminate"
-      (click)="allChecked = !allChecked; updateAllChecked()"
-      [style.padding]="lablePadd"
-      [style.width]="labelWidth"
-    >
-      <i class="input-checkbox"></i>
-      <span *ngIf="!hiddenLabel">全选</span></label
-    >
-    <label
-      class="customRadio"
-      [style.padding]="lablePadd"
-      [style.width]="labelWidth"
-      *ngFor="let option of checkOptions; let i = index"
-      [class.checked]="option.checked"
-      (click)="option.checked = !option.checked; change(option)"
-    >
-      <i class="input-checkbox"></i>
-      <span *ngIf="!hiddenLabel" [style.color]="option.color">{{ option.label }}</span></label
-    >
-  </div>
-</ng-container>

package/src/lib/checkbox/checkbox.component.less

@@ -1,104 +0,0 @@
-:host {
-  display: block;
-}
-:host ::ng-deep {
-  .ant-checkbox {
-    display: inline-block;
-  }
-
-  .ant-checkbox-checked .ant-checkbox-inner,
-  .ant-checkbox-wrapper,
-  .ant-checkbox {
-    background-color: inherit;
-    border-color: inherit;
-    color: inherit;
-    font-size: inherit;
-  }
-
-  .ant-checkbox-checked .ant-checkbox-inner::after,
-  .ant-checkbox-inner {
-    border-color: inherit;
-    background-color: inherit;
-  }
-
-  .ant-checkbox-wrapper {
-    margin-left: 0px;
-  }
-
-  .label-vertical {
-    label.ant-checkbox-wrapper {
-      text-align: center;
-    }
-
-    .ant-checkbox + span {
-      display: block;
-    }
-  }
-
-  .content {
-    // display: flex;
-    .customRadio {
-      display: inline-flex;
-      align-items: center;
-      cursor: pointer;
-      padding: 15px;
-    }
-
-    &.layout-vertical {
-      display: flex;
-      flex-direction: column;
-    }
-
-    &.label-vertical {
-      .customRadio {
-        flex-direction: column;
-        text-align: center;
-
-        > i.input-checkbox {
-          margin: 0 0 5px 0;
-        }
-      }
-    }
-  }
-
-  .ant-checkbox + span,
-  .customRadio > i.input-checkbox + span {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  .customRadio > i.input-checkbox {
-    display: inline-block;
-    width: var(--width);
-    height: var(--height);
-    font-size: var(--outerSize);
-    line-height: var(--height);
-    color: var(--color);
-    font-weight: var(--weight);
-    font-family: var(--family);
-    text-align: center;
-    background-image: var(--notSelect);
-    background-repeat: no-repeat;
-    background-size: cover;
-    margin: 0 5px 0 0;
-    flex: none;
-  }
-
-  .customRadio.checked > i.input-checkbox {
-    background-image: var(--select);
-    background-repeat: no-repeat;
-    background-size: cover;
-  }
-}
-
-.ant-checkbox-group {
-  display: inline;
-}
-
-:host.vertical::ng-deep {
-  .ant-checkbox-wrapper {
-    display: block;
-    text-align: center;
-  }
-}

package/src/lib/checkbox/checkbox.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-
-import { CheckboxComponent } from './checkbox.component';
-
-describe('CheckboxComponent', () => {
-  let component: CheckboxComponent;
-  let fixture: ComponentFixture<CheckboxComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [ CheckboxComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(CheckboxComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});