bbj-screen-widget 2.4.62 → 2.4.63

package/src/lib/shape/shape.component.ts

@@ -1,207 +0,0 @@
-import { Property, Widget, WidgetRef } from 'bbj-widget-base';
-import {
-  OnInit,
-  Component,
-  ElementRef,
-  OnDestroy,
-  NgZone,
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-} from '@angular/core';
-import { NzResizeObserver } from 'ng-zorro-antd/core/resize-observers';
-import { Subject } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
-
-@Component({
-  selector: 'sc-shape',
-  templateUrl: './shape.component.html',
-  styleUrls: ['./shape.component.less'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-@Widget('图形', { group: 'shape', icon: 'iconxingzhuang' })
-export class ShapeComponent implements OnInit, OnDestroy {
-  @Property('填充', {
-    ui: {
-      widget: 'myColor',
-      visibleIf: {
-        type: ['rect', 'polygonplus', 'polyhedrosis', 'circle', 'path', 'polygon', 'parallelogram', 'trapezoid'],
-      },
-    },
-  })
-  background = null;
-  @Property('线条颜色', { ui: { widget: 'myColor' } })
-  borderColor = '#3285ff';
-  @Property('线条粗细', { type: 'number' })
-  borderWidth = 1;
-  @Property('圆角', {
-    type: 'number',
-    ui: { widget: 'myRange', min: 0, max: 100, step: 1, visibleIf: { type: ['rect'] } },
-  })
-  fillet = 0;
-  @Property('几边形', {
-    type: 'number',
-    ui: { widget: 'myRange', min: 3, max: 100, step: 1, visibleIf: { type: ['polygonplus', 'polyhedrosis'] } },
-  })
-  side = 3;
-  @Property('内半径', { ui: { widget: 'myRange', min: 1, max: 99, step: 1, visibleIf: { type: ['polyhedrosis'] } } })
-  sr = 38;
-  @Property('上底', { ui: { widget: 'myRange', min: 1, max: 100, step: 1, visibleIf: { type: ['trapezoid'] } } })
-  upper = 60;
-  @Property('下底', {
-    ui: { widget: 'myRange', min: 1, max: 100, step: 1, visibleIf: { type: ['trapezoid'] } },
-  })
-  bottom = 100;
-  @Property('偏移', {
-    ui: {
-      widget: 'myRange',
-      min: -100,
-      max: 100,
-      step: 1,
-      visibleIf: { type: ['parallelogram', 'trapezoid', 'triangle'] },
-    },
-  })
-  deviation = 0;
-  @Property('透明度', { ui: { widget: 'myRange', min: 0, max: 1, step: 0.1 } })
-  opacity = 1;
-  @Property('阴影', { ui: { widget: 'myShadow' } })
-  shadow: any = { color: '', X: 0, Y: 0, Z: 0 };
-  @Property('', {
-    type: 'string',
-    ui: { hidden: true },
-  })
-  type = 'rect';
-  style: any;
-  image: string;
-  @Property('数据', { ui: { hidden: true } })
-  data: { x: number; y: number }[];
-  width: number;
-  height: number;
-  points: string;
-  destroy$ = new Subject();
-  filterId: string;
-  filterUrl: string;
-
-  constructor(
-    private elementRef: ElementRef,
-    private resizeObserver: NzResizeObserver,
-    private zone: NgZone,
-    private cd: ChangeDetectorRef,
-    private widgetRef: WidgetRef,
-  ) {}
-
-  ngOnInit() {
-    this.reset();
-    this.resizeObserver
-      .observe(this.elementRef)
-      .pipe(takeUntil(this.destroy$))
-      .subscribe(() => {
-        this.zone.run(() => {
-          this.reset();
-        });
-      });
-  }
-
-  ngOnDestroy(): void {
-    this.destroy$.next();
-    this.destroy$.complete();
-  }
-
-  reset() {
-    const { clientWidth: width, clientHeight: height } = this.elementRef.nativeElement;
-    this.width = width;
-    this.height = height;
-    this.style = {
-      opacity: this.opacity,
-      stroke: this.borderColor,
-      strokeWidth: this.borderWidth,
-      fill: this.background ? this.background : 'rgba(0,0,0,0)',
-    };
-    if (this.shadow && (this.shadow.X || this.shadow.Y || this.shadow.Z)) {
-      this.filterId = this.widgetRef.widget.id;
-      this.filterUrl = `url(#${this.filterId})`;
-    }
-    switch (this.type) {
-      case 'rect': // 矩形
-        this.style.rx = this.style.ry = this.fillet;
-        break;
-      case 'triangle': //三角形
-        this.points = `${width / 2 + (width * this.deviation) / 200},0 ${width},${height} 0,${height}`;
-        break;
-      case 'parallelogram': // 平行四边形
-        const offset = (width * this.deviation) / 100;
-        if (this.deviation >= 0) {
-          this.points = `${offset},0 ${width},0 ${width - offset},${height} 0,${height}`;
-        } else {
-          this.points = `0,0 ${width + offset},0 ${width},${height} ${-offset},${height}`;
-        }
-        break;
-      case 'trapezoid': // 梯形
-        const top = (this.upper * width) / 100;
-        const bottom = (this.bottom * width) / 100;
-        const offset1 = ((width - top) / 2) * (1 + this.deviation / 100);
-        const offset2 = ((width - bottom) / 2) * (1 - this.deviation / 100);
-        this.points = `${offset1},0 ${offset1 + top},0 ${offset2 + bottom},${height} ${offset2},${height}`;
-        break;
-      case 'polyline': //折线
-      case 'polygon': //多边形
-        this.points = '';
-        let minX: number, maxX: number, minY: number, maxY: number;
-        this.data.forEach(({ x, y }) => {
-          if (x < minX || minX == null) minX = x;
-          if (x > maxX || maxX == null) maxX = x;
-          if (y < minY || minY == null) minY = y;
-          if (y > maxY || maxY == null) maxY = y;
-        });
-        const scaleX = width / (maxX - minX);
-        const scaleY = height / (maxY - minY);
-        this.data.forEach(({ x, y }) => {
-          this.points += `${(x - minX) * scaleX},${(y - minY) * scaleY} `;
-        });
-        break;
-      case 'polygonplus': //正多边形
-        const rx = width / 2;
-        const ry = height / 2;
-        this.points = '';
-        for (let i = 0; i < this.side; i++) {
-          this.points += this.getEllipsePoint(i, this.side, rx, ry, rx, ry);
-        }
-        break;
-      case 'polyhedrosis': // 星形
-        this.points = '';
-        const rx1 = width / 2;
-        const ry1 = height / 2;
-        const rx2 = (rx1 * this.sr) / 100;
-        const ry2 = (ry1 * this.sr) / 100;
-        for (let i = 0; i < this.side; i++) {
-          this.points += this.getEllipsePoint(i, this.side, rx1, ry1, rx1, ry1);
-          this.points += this.getEllipsePoint(i + 1 / 2, this.side, rx1, ry1, rx2, ry2);
-        }
-        break;
-      case 'path':
-        this.points = '';
-        for (let i = 0; i < this.data.length; i++) {
-          this.points += 'L' + this.data[i].x + ' ' + this.data[i].y + ' ';
-        }
-        this.points = 'M' + this.points.substring(1) + 'Z';
-        break;
-      default:
-        break;
-    }
-    this.cd.markForCheck();
-  }
-
-  /**
-   * 获取椭圆上的的坐标点，起始角度为90度
-   * @param index 序号
-   * @param max 总数
-   * @param cx 中心x
-   * @param cy 中心y
-   * @param rx x半径
-   * @param ry y半径
-   * @returns
-   */
-  getEllipsePoint(index: number, max: number, cx: number, cy: number, rx: number, ry: number) {
-    const rad = ((index * 2) / max + 1 / 2) * Math.PI;
-    return cx + Math.cos(rad) * rx + ',' + (cy - Math.sin(rad) * ry) + ' ';
-  }
-}

package/src/lib/shape/shape.module.ts

@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ShapeComponent } from './shape.component';
-import { WidgetBaseModule, WidgetService } from 'bbj-widget-base';
-
-@NgModule({
-  declarations: [ShapeComponent],
-  imports: [CommonModule, WidgetBaseModule],
-})
-export class ShapeModule {
-  constructor(widgetService: WidgetService) {
-    widgetService.register(ShapeComponent);
-  }
-}

package/src/lib/shared/component/video-player/video-player.component.html

@@ -1,2 +0,0 @@
-<video *ngIf="type !== 'iframe' || !src" class="video-js" #video controls autoplay></video>
-<iframe *ngIf="type === 'iframe' && src" [src]="src | nzSanitizer: 'resourceUrl'"></iframe>

package/src/lib/shared/component/video-player/video-player.component.less

@@ -1,15 +0,0 @@
-:host {
-  display: block;
-  height: 100%;
-  width: 100%;
-}
-video {
-  height: 100%;
-  width: 100%;
-}
-iframe {
-  width: 100%;
-  height: 100%;
-  border: none;
-  pointer-events: none;
-}

package/src/lib/shared/component/video-player/video-player.component.spec.ts

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

package/src/lib/shared/component/video-player/video-player.component.ts

@@ -1,132 +0,0 @@
-import {
-  AfterViewInit,
-  Component,
-  ElementRef,
-  Input,
-  OnChanges,
-  OnDestroy,
-  OnInit,
-  SimpleChanges,
-  ViewChild,
-} from '@angular/core';
-import { LazyResult, LazyService } from '@delon/util';
-import { FileUrlService } from '../../service/file-url.service';
-declare const flvjs;
-declare const Hls;
-@Component({
-  selector: 'sc-video-player',
-  templateUrl: './video-player.component.html',
-  styleUrls: ['./video-player.component.less'],
-})
-export class VideoPlayerComponent implements OnInit, OnChanges, OnDestroy, AfterViewInit {
-  static loadFlvPromise: Promise<LazyResult>;
-  static loadHlsPromise: Promise<LazyResult>;
-  @Input()
-  type: string;
-  @Input()
-  src: string;
-  @Input()
-  hasAudio: boolean;
-  @ViewChild('video', { static: false })
-  video: ElementRef<HTMLVideoElement>;
-  flvPlayer: any;
-  hlsPlayer: any;
-  destroyed: boolean;
-  initd: boolean;
-
-  constructor(private lazy: LazyService, private fileUrlService: FileUrlService) {}
-
-  ngOnInit() {
-
-  }
-
-  ngAfterViewInit(): void {
-    this.reset();
-      this.initd = true;
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (this.initd && (changes.type || changes.src)) {
-      this.reset();
-    }
-  }
-
-  reset() {
-    if (this.type === 'hls') {
-      this.resetHls();
-    } else if (this.type === 'iframe') {
-      this.destroy();
-    } else {
-      this.resetFlv();
-    }
-  }
-
-  loadHls() {
-    if (VideoPlayerComponent.loadHlsPromise == null) {
-      VideoPlayerComponent.loadHlsPromise = this.lazy.loadScript('/assets/js/hls.js');
-    }
-    return VideoPlayerComponent.loadHlsPromise;
-  }
-
-  async resetHls() {
-    await this.loadHls();
-    this.destroy();
-    if (this.src && Hls.isSupported() && !this.destroyed) {
-      const url = this.fileUrlService.getUrl(this.src);
-      this.hlsPlayer = new Hls();
-      this.hlsPlayer.loadSource(url);
-      this.hlsPlayer.attachMedia(this.video.nativeElement);
-    }
-  }
-
-  async resetFlv() {
-    await this.loadFlv();
-    this.destroy();
-    // TODO 目前只做了flv，接下来要根据type播放不同类型
-    if (this.src && !this.destroyed) {
-      const url = this.fileUrlService.getUrl(this.src);
-      this.flvPlayer = flvjs.createPlayer(
-        {
-          type: 'flv',
-          url,
-          hasAudio: this.hasAudio === true,
-          hasVideo: true,
-          isLive: true,
-          withCredentials: false,
-        },
-        {
-          enableWorker: false,
-          lazyLoadMaxDuration: 3 * 60,
-          seekType: 'range',
-        },
-      );
-      this.flvPlayer.attachMediaElement(this.video.nativeElement);
-      this.flvPlayer.load();
-    }
-  }
-
-  loadFlv() {
-    if (VideoPlayerComponent.loadFlvPromise == null) {
-      VideoPlayerComponent.loadFlvPromise = this.lazy.loadScript('assets/js/flv.min.js');
-    }
-    return VideoPlayerComponent.loadFlvPromise;
-  }
-
-  destroy() {
-    if (this.flvPlayer) {
-      this.flvPlayer.unload();
-      this.flvPlayer.detachMediaElement();
-      this.flvPlayer.destroy();
-      this.flvPlayer = null;
-    }
-    if (this.hlsPlayer) {
-      this.hlsPlayer.destroy();
-      this.hlsPlayer = null;
-    }
-  }
-
-  ngOnDestroy(): void {
-    this.destroy();
-    this.destroyed = true;
-  }
-}

package/src/lib/shared/component/video-player/video-player.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { VideoPlayerComponent } from './video-player.component';
-import { NzPipesModule } from 'ng-zorro-antd/pipes';
-
-@NgModule({
-  declarations: [VideoPlayerComponent],
-  imports: [CommonModule, NzPipesModule],
-  exports: [VideoPlayerComponent],
-})
-export class VideoPlayerModule {}

package/src/lib/shared/model/scale.token.ts

@@ -1,8 +0,0 @@
-import { InjectionToken } from "@angular/core";
-import { BehaviorSubject } from "rxjs";
-
-export interface ScaleConfig {
-    x: number;
-    y: number;
-  }
-export const SCALE_OBSERVER = new InjectionToken<BehaviorSubject<ScaleConfig>>('screen.scale-observer');

package/src/lib/shared/service/common.service.ts

@@ -1,28 +0,0 @@
-import { Injectable } from '@angular/core';
-import { BaiduMapService } from 'bbj-screen-widget/core';
-import { GaodeMapService } from './gaode-map.service';
-
-/**
- * @deprecated
- * 用BaiduMapService和GaodeMapService替代
- */
-@Injectable({ providedIn: 'root' })
-export class CommonService {
-  constructor(private baiduMapService: BaiduMapService, public gaodeMapService: GaodeMapService) {}
-
-  /**
-   * @deprecated
-   * 用BaiduMapService.loadMap替代
-   */
-  getMap(): Promise<any> {
-    return this.baiduMapService.loadMap();
-  }
-
-  /**
-   * @deprecated
-   * 用GaodeMapService.loadMap替代
-   */
-  loadMap(): Promise<any> {
-    return this.gaodeMapService.loadMap();
-  }
-}

package/src/lib/shared/service/file-url.service.ts

@@ -1,8 +0,0 @@
-import { Injectable } from '@angular/core';
-
-@Injectable({ providedIn: 'root' })
-export class FileUrlService {
-  getUrl(url: string) {
-    return url;
-  }
-}

package/src/lib/shared/service/gaode-map.service.ts

@@ -1,37 +0,0 @@
-import { HttpClient } from '@angular/common/http';
-import { Injectable } from '@angular/core';
-import { LazyService } from '@delon/util';
-
-// (window as any)._AMapSecurityConfig = {
-//   securityJsCode: '1f288f3bf91dc24647c540ef2988ba30',
-// };
-declare const AMap;
-
-@Injectable({ providedIn: 'root' })
-export class GaodeMapService {
-  private loadAmapPromise: Promise<any>;
-
-  constructor(public lazy: LazyService, private http: HttpClient) {}
-
-  loadMap(): Promise<any> {
-    if (typeof AMap !== 'undefined') {
-      return Promise.resolve();
-    }
-    if (!this.loadAmapPromise) {
-      this.loadAmapPromise = this.lazy.loadScript(
-        'https://webapi.amap.com/maps?v=1.4.15&key=803815fd5b53fbb5bfb6656b049f1d37&plugin=AMap.ControlBar',
-      );
-    }
-    return this.loadAmapPromise;
-  }
-
-  getWeather(city): Promise<any> {
-    // 高德地图
-    return this.http
-      .jsonp(
-        `https://restapi.amap.com/v3/weather/weatherInfo?key=d633c7a49d34575ad5fb4235856f3a7b&city=${city}`,
-        'callback',
-      )
-      .toPromise();
-  }
-}

package/src/lib/shared/service/highcharts.service.ts

@@ -1,29 +0,0 @@
-import { Injectable } from '@angular/core';
-import { LazyService } from '@delon/util';
-
-declare const Highcharts;
-
-@Injectable({ providedIn: 'root' })
-export class HighChartsService {
-  private loadHighChartsPromise: Promise<any>;
-  private loadHighCharts3DPromise: Promise<any>;
-  constructor(private lazy: LazyService) {}
-
-  load() {
-    if (typeof Highcharts !== 'undefined') {
-      return Promise.resolve();
-    }
-    if (this.loadHighChartsPromise == null) {
-      this.loadHighChartsPromise = this.lazy.loadScript('assets/js/highcharts/highcharts.js');
-    }
-    return this.loadHighChartsPromise;
-  }
-
-  async load3D() {
-    await this.load();
-    if (this.loadHighCharts3DPromise == null) {
-      this.loadHighCharts3DPromise = this.lazy.loadScript('assets/js/highcharts/highcharts-3d.js');
-    }
-    return this.loadHighCharts3DPromise;
-  }
-}

package/src/lib/shared/service/http.service.ts

@@ -1,15 +0,0 @@
-import { HttpClient } from '@angular/common/http';
-import { Injectable } from '@angular/core';
-
-@Injectable()
-export class HttpService {
-  constructor(private http: HttpClient) {}
-
-  get(url: string, options: any) {
-    return this.http.get(url, options).toPromise();
-  }
-
-  post(url: string, body: any, options: any) {
-    return this.http.post(url, body, options).toPromise();
-  }
-}

package/src/lib/shared/util/base.util.ts

@@ -1,4 +0,0 @@
-import { v1 as uuid } from 'uuid';
-export const getUUID = () => {
-  return uuid().replace(/-/g, '');
-};

package/src/lib/shared/util/echarts.util.ts

@@ -1,11 +0,0 @@
-export function getEchartsTextStyle(font: any) {
-  const textStyle: any = {};
-  if (font) {
-    textStyle.color = font.color;
-    textStyle.fontFamily = font.family;
-    textStyle.fontWeight = font.weight;
-    textStyle.fontSize = font.size;
-    textStyle.lineHeight = font.lineHeight;
-  }
-  return textStyle;
-}

package/src/lib/shared/util/style.util.ts

@@ -1,12 +0,0 @@
-export function getFontStyle(font: any) {
-  let style: any = {};
-  if (font) {
-    if (font.size) style.fontSize = font.size + 'px';
-    if (font.family) style.fontFamily = font.family;
-    if (font.color) style.color = font.color;
-    if (font.weight) style.fontWeight = font.weight;
-    if (font.space) style.letterSpacing = font.space + 'px';
-    if (font.lineHeight) style.lineHeight = font.lineHeight + 'px';
-  }
-  return style;
-}

package/src/lib/shuffling-list/color.pipe.ts

@@ -1,21 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-
-@Pipe({
-  name: 'bindColor',
-})
-export class ColorPipe implements PipeTransform {
-  transform(data: any, ...args: any[]): unknown {
-    if (data) {
-      const bindColor = args[0];
-      if (bindColor?.length) {
-        for (const item of bindColor) {
-          const { key, value, color } = item;
-          if (key && color && data[key] == value) {
-            return color;
-          }
-        }
-      }
-    }
-    return null;
-  }
-}

package/src/lib/shuffling-list/shuffling-list.component.html

@@ -1,37 +0,0 @@
-<ng-container *ngIf="data">
-  <div *ngIf="headDisplay" class="head" [ngStyle]="headStyle">
-    <div *ngIf="serialNumberDisplay" class="cell index-col"></div>
-    <div *ngFor="let column of columns" class="cell" [ngStyle]="column.headStyle">{{ column.title }}</div>
-  </div>
-  <div class="body" [class.carousel]="carousel" (mouseover)="mouseover()" (mouseout)="mouseout()">
-    <div class="body-scroll" [ngStyle]="tableStyle" (mousewheel)="onMousewheel($event)">
-      <ng-template #list>
-        <div
-          *ngFor="let row of content; let idx = index"
-          class="row"
-          [style.backgroundColor]="idx % 2 == 0 ? oddBackground : evenBackground"
-          [ngStyle]="rowStyle"
-          [style.color]="row | bindColor: bindColor"
-          (click)="onClick(row)"
-        >
-          <div *ngIf="serialNumberDisplay" class="cell index-col">
-            {{ idx + 1 }}
-          </div>
-          <ng-container *ngFor="let column of columns; let index = index">
-            <div class="cell" [ngStyle]="column.cellStyle" [title]="row[column.index]">
-              <span
-                *ngIf="row[column.index] != null"
-                [class.clickable]="column.clickable"
-                (click)="onCellClick(column, row, $event)"
-                [innerHTML]="row[column.index] | nzSafeNull | nzSanitizer: 'html'"
-              ></span>
-            </div>
-          </ng-container>
-        </div>
-        <div *ngIf="placeholder" [style.height.px]="placeholder"></div>
-      </ng-template>
-      <ng-container [ngTemplateOutlet]="list"></ng-container>
-      <ng-container *ngIf="_carousel" [ngTemplateOutlet]="list"></ng-container>
-    </div>
-  </div>
-</ng-container>