bbj-screen-widget 2.4.62 → 2.4.63

package/src/lib/drop-down-detail-list/drop-down-detail-list.component.ts

@@ -1,117 +0,0 @@
-import {Component, OnInit, SimpleChanges} from '@angular/core';
-import {Data, DataOutput, Drill, Property, Widget} from 'bbj-widget-base';
-
-@Component({
-  selector: 'sc-drop-down-detail-list',
-  templateUrl: './drop-down-detail-list.component.html',
-  styleUrls: ['./drop-down-detail-list.component.less']
-})
-@Widget('下拉详情列表',{group:'component',image: 'assets/img/screen/drop-down-detail-list.png'})
-export class DropDownDetailListComponent implements OnInit {
-  data=[];
-  @Property('字体', { ui: { widget: 'myFont' } })
-  font: any = {
-    family: '',
-    color: '#FFFFFF',
-    weight: 'normal',
-    size: 16,
-    space: 0,
-    lineHeight: 0,
-  };
-  @Property('高', { type: 'number'})
-  height=30;
-  @Property('详情字体', { type: 'number'})
-  fontSize=16;
-  @Data({
-    properties: {
-      titleName: { type: 'string', title: '名称' },
-      detail: { type: 'string', title: '详情' },
-    },
-  })
-  _data: any[] = [
-    {titleName:'a',detail:'aa'},
-    {titleName:'a',detail:'bb'},
-    {titleName:'b',detail:'bb'},
-    {titleName:'b',detail:'cc'},
-  ];
-  // @Drill()
-  // @DataOutput(['titleName', 'list'])
-  constructor() { }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes._data){
-      this.data=this.jsonMerge(this._data,['titleName']);
-      this.data.forEach(function(item){
-        item.icon='caret-down'
-      });
-    }
-  }
-
-  ngOnInit() {
-    this.font = {
-      fontSize: this.font.size + 'px',
-      fontFamily: this.font.family,
-      color: this.font.color,
-      fontWeight: this.font.weight,
-      letterSpacing: this.font.space + 'px',
-      lineHeight: 'normal'
-    }
-  }
-  openList(index){
-    if(this.data[index].icon=='caret-down'){
-      this.data[index].icon='caret-up'
-    }else if(this.data[index].icon=='caret-up'){
-      this.data[index].icon='caret-down'
-    }
-  }
-  jsonMerge(jsonArr,keyArr){
-    const newJson = [] // 合并好的数据都放在这个数组里
-    jsonArr.forEach((itemJson,indexJson)=>{
-      let mark = -1
-      const finded = newJson.find((itemFind, indexFind) => {
-        if (itemFind[keyArr[0]] === itemJson[keyArr[0]]) {
-          mark = indexFind
-          return itemFind[keyArr[0]] === itemJson[keyArr[0]]
-        }
-      })
-      if(!finded){
-        const value = {}
-        value[keyArr[0]] = itemJson[keyArr[0]]
-        value.list = []
-        const list = {}
-        for(const i in itemJson){
-          if(i!==keyArr[0]){
-            list[i] = itemJson[i]
-          }
-        }
-        value.list.push(list)
-        newJson.push(value)
-      }else{
-        const list = {}
-        for(const i in itemJson){
-          if(i!==keyArr[0]){
-            list[i] = itemJson[i]
-          }
-        }
-        newJson[mark].list.push(list)
-      }
-    })
-    // 递归的条件是不断的缩减keyArr的length，每次都去除第零个，直到为0
-    if(keyArr.length === 1){
-      return newJson
-    }else{
-      return newJson.map((itemInfo)=>{
-        const newKeyArr = []
-        keyArr.forEach((item,index)=>{
-          if(index>0){
-            newKeyArr.push(item)
-          }
-        })
-        return{
-          [keyArr[0]]:itemInfo[keyArr[0]],
-          list:this.jsonMerge(itemInfo.list,newKeyArr)
-        }
-      })
-    }
-  }
-}

package/src/lib/drop-down-detail-list/drop-down-detail-list.module.ts

@@ -1,15 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { NzListModule } from 'ng-zorro-antd/list';
-import { DropDownDetailListComponent } from './drop-down-detail-list.component';
-import { WidgetBaseModule, WidgetService } from 'bbj-widget-base';
-
-@NgModule({
-  declarations: [DropDownDetailListComponent],
-  imports: [CommonModule, WidgetBaseModule, NzListModule],
-})
-export class DropDownDetailListModule {
-  constructor(widgetService: WidgetService) {
-    widgetService.register(DropDownDetailListComponent);
-  }
-}

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

@@ -1,15 +0,0 @@
-<div class="dynamicList">
-  <nz-list nzBordered="false" nzSplit="false">
-    <nz-list-item *ngFor="let item of _data" [ngStyle]="font" [style.backgroundImage]="'url(' + image + ')'" [style.height]="height+'px'">
-      <div class="listTop">
-        <div>{{item.add}}</div>
-        <div>{{item.name}}</div>
-      </div>
-      <hr class="listLine" *ngIf="lineShow" [style.backgroundColor]="lineColor">
-      <div class="listBottom" >
-        <div> 联系方式：</div>
-        <div>{{item.tel}}</div>
-      </div>
-    </nz-list-item>
-  </nz-list>
-</div>

package/src/lib/dynamic-list/dynamic-list.component.less

@@ -1,31 +0,0 @@
-.dynamicList {
-  height: 100%;
-  overflow: auto;
-}
-.ant-list-item {
-  flex-wrap: wrap;
-  background-size: 100% 100%;
-  margin-bottom: 10px;
-  padding: 0;
-}
-.listTop{
-  height: calc(50% - 0.5px);
-  justify-content: space-between;
-}
-.listTop, .listBottom {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  padding:0 10px;
-}
-.listBottom{
-  height: calc(50% - 0.5px);
-  justify-content: space-between;
-}
-
-.listLine {
-  width: 100%;
-  height: 1px;
-  border: 0;
-  margin: 0;
-}

package/src/lib/dynamic-list/dynamic-list.component.spec.ts

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

package/src/lib/dynamic-list/dynamic-list.component.ts

@@ -1,57 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import {Data, Property, Widget} from 'bbj-widget-base';
-
-@Component({
-  selector: 'sc-dynamic-list',
-  templateUrl: './dynamic-list.component.html',
-  styleUrls: ['./dynamic-list.component.less']
-})
-@Widget('动态列表',{group:'component',image: 'assets/img/screen/dynamic-list.png'})
-export class DynamicListComponent implements OnInit {
-  @Property('高', { type: 'number'})
-  height=100;
-  @Property('是否显示分割线',{ui:{widget: 'checkbox'}})
-  lineShow = true;
-  @Property('线颜色',{ui:{widget: 'myColor'}})
-  lineColor = '#ffffff';
-  @Property('字体', { ui: { widget: 'myFont' } })
-  font: any = {
-    family: '',
-    color: '#FFFFFF',
-    weight: 'normal',
-    size: 16,
-    space: 0,
-    lineHeight: 0,
-  };
-  @Property('',{min: 1,ui:{widget: 'myUpload', spanLabel: 0, spanControl: 24}})
-  image: string;
-  @Data({
-    properties: {
-      add: { type: 'string', title: '地址' },
-      name: { type: 'string', title: '姓名' },
-      tel: { type: 'string', title: '电话' },
-    },
-  })
-  _data=[{
-    name:'周某',
-    tel:'13656789414',
-    add:'变电检修室'
-  },{
-    name:'周某某',
-    tel:'13612349414',
-    add:'变电运维室'
-  }];
-  constructor() { }
-
-  ngOnInit() {
-    this.font = {
-      fontSize: this.font.size + 'px',
-      fontFamily: this.font.family,
-      color: this.font.color,
-      fontWeight: this.font.weight,
-      letterSpacing: this.font.space + 'px',
-      lineHeight: 'normal'
-    }
-  }
-
-}

package/src/lib/dynamic-list/dynamic-list.module.ts

@@ -1,15 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { DynamicListComponent } from './dynamic-list.component';
-import { NzListModule } from 'ng-zorro-antd/list';
-import { WidgetBaseModule, WidgetService } from 'bbj-widget-base';
-
-@NgModule({
-  declarations: [DynamicListComponent],
-  imports: [CommonModule, WidgetBaseModule, NzListModule],
-})
-export class DynamicListModule {
-  constructor(widgetService: WidgetService) {
-    widgetService.register(DynamicListComponent);
-  }
-}

package/src/lib/funnel-chart/funnel-chart.component.html

@@ -1,7 +0,0 @@
-<div
-  echarts
-  [options]="chartOption"
-  class="demo-chart"
-  (chartClick)="onChartClick($event)"
-  [initOpts]="{ renderer: 'svg' }"
-></div>

package/src/lib/funnel-chart/funnel-chart.component.less

@@ -1,8 +0,0 @@
-:host {
-  display: block;
-  height: 100%;
-  width: 100%;
-}
-.demo-chart {
-  height: 100%;
-}

package/src/lib/funnel-chart/funnel-chart.component.spec.ts

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

package/src/lib/funnel-chart/funnel-chart.component.ts

@@ -1,198 +0,0 @@
-import { Component, OnChanges, OnInit, SimpleChanges, EventEmitter } from '@angular/core';
-import { Property, Widget, Data, Drill, DataOutput } from 'bbj-widget-base';
-import { BasicLineChartComponent } from '../basic-line-chart/basic-line-chart.component';
-
-@Component({
-  selector: 'sc-funnel-chart',
-  templateUrl: './funnel-chart.component.html',
-  styleUrls: ['./funnel-chart.component.less'],
-})
-@Widget('三角图', {
-  group: 'otherChart',
-  image: 'assets/img/screen/funnel.png',
-  icon: 'icontubiao',
-})
-export class FunnelChartComponent extends BasicLineChartComponent implements OnInit, OnChanges {
-  @Property('图表样式', {
-    ui: {
-      widget: 'myImageExample',
-      spanLabel: 24,
-      spanControl: 24,
-      reset: ['seriesColor'],
-      example: [
-        {
-          background: 'assets/img/screen/funnel1.png',
-          data: {
-            seriesColor: ['#FFE53F', '#FFBF47', '#FF7F1D', '#FC460D', '#EE2100'],
-          },
-        },
-        {
-          background: 'assets/img/screen/funnel2.png',
-          data: {
-            seriesColor: ['#C0E656', '#52D852', '#00B335', '#008F44', '#006A61'],
-          },
-        },
-        {
-          background: 'assets/img/screen/funnel3.png',
-          data: {
-            seriesColor: ['#00E5E3', '#0DBBD8', '#2A8BC9', '#345EBB', '#003560'],
-          },
-        },
-        {
-          background: 'assets/img/screen/funnel4.png',
-          data: {
-            seriesColor: ['#FF6DB7', '#E23FCA', '#AD12CE', '#7F0B84', '#610796'],
-          },
-        },
-      ],
-    },
-  })
-  example: any;
-  @Property('系列颜色', {
-    ui: {
-      widget: 'seriesColor',
-      example: ['#D0021B', '#F5A623', '#F8E71C', '#50E3C2', '#3285FF', '#B45FFF', '#9B9B9B', '#333333'],
-    },
-  })
-  seriesColor = ['#00E5E3', '#0DBBD8', '#2A8BC9', '#345EBB', '#003560'];
-  @Property('字体', { ui: { widget: 'myFont' } })
-  font: any = {
-    family: '',
-    color: '#FFFFFF',
-    weight: 'normal',
-    size: 12,
-    space: 0,
-    lineHeight: '',
-  };
-  @Property('边距', { ui: { widget: 'myGrid' } })
-  grid: any = {
-    top: 60,
-    right: 16,
-    bottom: 20,
-    left: 16,
-  };
-  @Property('图例', {
-    ui: { widget: 'select' },
-    enum: [
-      { label: '无', value: 'none' },
-      { label: '自动', value: 'auto' },
-      { label: '左对齐', value: 'left' },
-      { label: '右对齐', value: 'right' },
-    ],
-  })
-  align = 'auto';
-  @Property('最大值', {
-    ui: { widget: 'myRange', min: 0, max: 100, step: 1 },
-  })
-  max = 100;
-  @Property('最小值', {
-    ui: { widget: 'myRange', min: 0, max: 100, step: 1 },
-  })
-  min = 0;
-  @Property('排序', {
-    ui: { widget: 'select' },
-    enum: [
-      { label: '升序', value: 'ascending' },
-      { label: '降序', value: 'descending' },
-      { label: '无/按数据先后', value: 'none' },
-    ],
-  })
-  sort = 'ascending';
-  @Property('间隔', {
-    ui: { widget: 'myRange', min: 0, max: 10, step: 1 },
-  })
-  gap = 4;
-  @Property('标签', {
-    ui: { widget: 'boolean', checkedChildren: '开', unCheckedChildren: '关' },
-  })
-  label = true;
-
-  chartOption: any = {};
-  @Data({
-    properties: {
-      x: { type: 'string', title: '类目' },
-      y: { type: 'number', title: '值' },
-    },
-  })
-  _data = [
-    { x: '一月', y: 20 },
-    { x: '二月', y: 40 },
-    { x: '三月', y: 60 },
-    { x: '四月', y: 80 },
-    { x: '五月', y: 100 },
-  ];
-  @Drill()
-  @DataOutput(['x'])
-  dataClick = new EventEmitter<any>();
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes._data) {
-      const style = {
-        color: this.font.color,
-        fontFamily: this.font.family,
-        fontWeight: this.font.weight,
-        fontSize: this.font.size,
-        lineHeight: this.font.lineHeight,
-      };
-
-      this.chartOption = {
-        legend: {
-          data: this.xData,
-          align: this.align,
-          show: this.align !== 'none',
-          textStyle: style,
-        },
-        calculable: true,
-        color: this.seriesColor,
-        series: [
-          {
-            type: 'funnel',
-            top: this.grid.top,
-            right: this.grid.right,
-            left: this.grid.left,
-            bottom: this.grid.bottom,
-            maxSize: this.max + '%',
-            minSize: this.min + '%',
-            sort: this.sort,
-            gap: this.gap,
-            itemStyle: { borderWidth: 0 },
-            label: {
-              show: this.label,
-              position: 'inside',
-            },
-          },
-        ],
-        dataset: {
-          // 用 dimensions 指定了维度的顺序。直角坐标系中，
-          // 默认把第一个维度映射到 X 轴上，第二个维度映射到 Y 轴上。
-          // 如果不指定 dimensions，也可以通过指定 series.encode
-          // 完成映射，参见后文。
-          dimensions: [],
-          source: [],
-        },
-      };
-      this.reloadData();
-      // for (let i = 0; i < this._data.length; i++) {
-      //   this.chartOption.series[0].data.push({
-      //     value: this._data[i].y,
-      //     name: this._data[i].x
-      //   });
-      // }
-      // console.log(JSON.stringify(this.chartOption));
-    }
-  }
-  reloadData() {
-    const dimensions = ['x', 'y'];
-    const source = this._data;
-    for (let i = 0; i < this._data.length; i++) {
-      this.xData[i] = this._data[i].x;
-    }
-    this.uniqueData(this.xData);
-    this.chartOption.dataset.dimensions = dimensions;
-    this.chartOption.dataset.source = source;
-  }
-  ngOnInit() {}
-  onChartClick(event) {
-    this.dataClick.emit({ x: event.name, s: event.seriesName });
-  }
-}

package/src/lib/funnel-chart/funnel-chart.module.ts

@@ -1,15 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FunnelChartComponent } from './funnel-chart.component';
-import { NgxEchartsModule } from 'ngx-echarts';
-import { WidgetBaseModule, WidgetService } from 'bbj-widget-base';
-
-@NgModule({
-  declarations: [FunnelChartComponent],
-  imports: [CommonModule, WidgetBaseModule, NgxEchartsModule],
-})
-export class FunnelChartModule {
-  constructor(widgetService: WidgetService) {
-    widgetService.register(FunnelChartComponent);
-  }
-}

package/src/lib/gantt/gantt.component.html

@@ -1,10 +0,0 @@
-<!--<nz-date-picker [(ngModel)]="initDate" (ngModelChange)="onChange(initDate)"></nz-date-picker>-->
-<full-calendar *ngIf="calendarOptions" [options]="calendarOptions" ></full-calendar>
-<ng-template #fcEventContent let-data="data">
-
-  <div class="progress" nz-tooltip [nzTooltipTitle]="titleTemplate" [ngStyle]="data.progressStyle">
-    <span class="bar" [ngStyle]="data.barStyle">{{data.title}}</span>
-  </div>
-  <ng-template #titleTemplate><i nz-icon nzType="file" style="margin-right: 8px"></i> <span>{{data.title}}<br/>开始:{{data.start}}<br/>结束:{{data.end}}<br/>进度:{{data.progress}}</span></ng-template>
-</ng-template>
-

package/src/lib/gantt/gantt.component.less

@@ -1,76 +0,0 @@
-:host ::ng-deep {
-  .fc-direction-ltr {
-    height: 100%;
-  }
-  .fc .fc-view-harness {
-    padding-bottom: 0 !important;
-  }
-  .progress {
-    overflow: hidden;
-    height: var(--height);
-    //margin-bottom: 20px;
-    //margin-top: 20px;
-    //margin-left: 30px;
-    background-color: #f7f7f7;
-    //background-image: -moz-linear-gradient(top, #f5f5f5, #f9f9f9);
-    //background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f5f5), to(#f9f9f9));
-    //background-image: -webkit-linear-gradient(top, #f5f5f5, #f9f9f9);
-    //background-image: -o-linear-gradient(top, #f5f5f5, #f9f9f9);
-    //background-image: linear-gradient(to bottom, #f5f5f5, #f9f9f9);
-    background-repeat: repeat-x;
-    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#fff9f9f9', GradientType=0);
-    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-    -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-    -webkit-border-radius: 4px;
-    -moz-border-radius: 4px;
-    border-radius: 4px;
-    width: 100%;
-    //margin-right:12px;
-  }
-
-  .progress .bar {
-    white-space: nowrap;
-    width: 0%;
-    height: 100%;
-    color: #ffffff;
-    float: left;
-    font-size: 12px;
-    text-align: center;
-    align-items: center;
-    display: flex;
-    // justify-content: center;
-    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
-    background-color: #0e90d2;
-    //background-image: -moz-linear-gradient(top, #149bdf, #0480be);
-    //background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#149bdf), to(#0480be));
-    //background-image: -webkit-linear-gradient(top, #149bdf, #0480be);
-    //background-image: -o-linear-gradient(top, #149bdf, #0480be);
-    //background-image: linear-gradient(to bottom, #149bdf, #0480be);
-    background-repeat: repeat-x;
-    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff149bdf', endColorstr='#ff0480be', GradientType=0);
-    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-    -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    -webkit-transition: width 0.6s ease;
-    -moz-transition: width 0.6s ease;
-    -o-transition: width 0.6s ease;
-    transition: width 0.6s ease;
-  }
-  .fc-license-message {
-    display: none !important;
-  }
-  .fc table {
-    font-size: 17px !important;
-  }
-  .fc-resource .fc-datagrid-cell-main {
-    font-size: var(--fontSize);
-    color: var(--color);
-    font-weight: var(--weight);
-    font-family: var(--family);
-    line-height: var(--lineHeight); 
-  }
-}

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

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