@inspark/inspark-components 1.0.36 → 1.0.38

package/full/fesm5/inspark-inspark-components.js

@@ -3511,6 +3511,7 @@ var ContentToggleComponent = /** @class */ (function () {
         this.cdr = cdr;
         this.isOpen = true;
         this.icon = null;
+        this.manualArrow = true;
         this.toggle = new EventEmitter();
     }
     ContentToggleComponent.prototype.toggleOpen = function () {
@@ -3533,6 +3534,10 @@ var ContentToggleComponent = /** @class */ (function () {
         Input(),
         __metadata("design:type", String)
     ], ContentToggleComponent.prototype, "icon", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", Boolean)
+    ], ContentToggleComponent.prototype, "manualArrow", void 0);
     __decorate([
         Output(),
         __metadata("design:type", EventEmitter)
@@ -3540,7 +3545,7 @@ var ContentToggleComponent = /** @class */ (function () {
     ContentToggleComponent = __decorate([
         Component({
             selector: 'in-content-toggle',
-            template: "<div class=\"block\" (click)=\"toggleOpen()\" tabIndex=\"1\">\n    <span [ngClass]=\"{arrow: true, close: !isOpen}\">\n        <in-svg [src]=\"'arrow-down.svg'\" width=\"48px\" height=\"48px\"></in-svg>\n    </span>\n  <span class=\"label\"><in-svg *ngIf=\"icon\" class=\"label-icon\" [src]=\"icon\"></in-svg> {{label}}</span>\n  <span class=\"counter\">\n    <ng-content select=\"[header]\"></ng-content>\n    </span>\n</div>\n<div class=\"container\" *ngIf=\"isOpen\">\n  <ng-content select=\"[body]\"></ng-content>\n</div>\n",
+            template: "<div class=\"block\" (click)=\"toggleOpen()\" tabIndex=\"1\">\n    <span [ngClass]=\"{arrow: true, close: !isOpen}\">\n        <in-svg *ngIf=\"manualArrow\" [src]=\"'arrow-down.svg'\" width=\"48px\" height=\"48px\"></in-svg>\n        <ng-content select=\"[arrow]\"></ng-content>\n    </span>\n  <span class=\"label\">\n    <in-svg *ngIf=\"icon\" class=\"label-icon\" [src]=\"icon\"></in-svg>\n    {{label}}\n  </span>\n  <span class=\"counter\">\n    <ng-content select=\"[header]\"></ng-content>\n    </span>\n</div>\n<div class=\"container\" *ngIf=\"isOpen\">\n  <ng-content select=\"[body]\"></ng-content>\n</div>\n",
             styles: ["@charset \"UTF-8\";.block{font-size:12px;text-transform:uppercase;cursor:pointer;display:flex;white-space:nowrap}.block:hover{background:var(--colorBgLevel2)}.block>span{display:inline-block;margin-right:4px}.block .label{margin-right:8px;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis}.block .counter{display:flex;align-items:center;padding-right:8px}.block .arrow{margin-right:0}.block .arrow.close{transform:rotate(-90deg)}.label-icon{margin-right:4px;width:16px;height:16px}"]
         }),
         __metadata("design:paramtypes", [ChangeDetectorRef])
@@ -4050,6 +4055,114 @@ var AutoCompleteComponentModule = /** @class */ (function () {
     return AutoCompleteComponentModule;
 }());
 
+var PieService = /** @class */ (function () {
+    function PieService() {
+        this.colorArray = ['-1', 0, 1, 2, 3, 4]; // Цвета и последовательность в которой они будут отображены
+        this.colors = {
+            1: '#31ac51',
+            2: '#EE9946',
+            3: '#F95C5D',
+            4: '#a20000',
+            0: '#7E8087',
+            '-1': '#85B3CB'
+        };
+    }
+    PieService.prototype.create = function (statuses, size) {
+        var _this = this;
+        var data = [];
+        var allCount = 0;
+        this.colorArray.forEach(function (color) {
+            allCount += statuses[color] || 0;
+        });
+        var cumulativePercent = 0;
+        this.colorArray.forEach(function (color) {
+            var count = statuses[color];
+            if (!count) {
+                return;
+            }
+            var percent = count / allCount;
+            var _a = __read(_this.getCoordinatesForPercent(size, cumulativePercent), 2), startX = _a[0], startY = _a[1];
+            cumulativePercent += percent;
+            var _b = __read(_this.getCoordinatesForPercent(size, cumulativePercent), 2), endX = _b[0], endY = _b[1];
+            var largeArcFlag = percent > .5 ? 1 : 0;
+            var pathData = [
+                "M " + startX + " " + startY,
+                "A 20 20 0 " + largeArcFlag + " 1 " + endX + " " + endY,
+                "L 0 0",
+            ].join(' ');
+            data.push({
+                path: pathData,
+                color: _this.colors[color + '']
+            });
+        });
+        return data;
+    };
+    PieService.prototype.getCoordinatesForPercent = function (size, percent) {
+        var x = size / 2 * Math.cos(2 * Math.PI * percent);
+        var y = size / 2 * Math.sin(2 * Math.PI * percent);
+        return [x, y];
+    };
+    PieService = __decorate([
+        Injectable()
+    ], PieService);
+    return PieService;
+}());
+
+var ObjectPieComponent = /** @class */ (function () {
+    function ObjectPieComponent(translate, pieService, cdr) {
+        this.translate = translate;
+        this.pieService = pieService;
+        this.cdr = cdr;
+        this.count = 30;
+        this.size = 40;
+        this.statuses = {
+            '-1': 20,
+            0: 4,
+            1: 3,
+            2: 4,
+            3: 5
+        };
+    }
+    ObjectPieComponent.prototype.ngOnInit = function () {
+        this.data = this.pieService.create(this.statuses, this.size);
+    };
+    ObjectPieComponent.prototype.ngOnDestroy = function () {
+    };
+    ObjectPieComponent.prototype.ngOnChanges = function (changes) {
+    };
+    ObjectPieComponent.ctorParameters = function () { return [
+        { type: TranslateService },
+        { type: PieService },
+        { type: ChangeDetectorRef }
+    ]; };
+    __decorate([
+        Input(),
+        __metadata("design:type", Object)
+    ], ObjectPieComponent.prototype, "count", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", Object)
+    ], ObjectPieComponent.prototype, "size", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", Object)
+    ], ObjectPieComponent.prototype, "statuses", void 0);
+    ObjectPieComponent = __decorate([
+        Component({
+            selector: 'in-pie',
+            template: "<div class=\"pie-block\">\n    <svg viewBox=\"-20 -20 40 40\">\n      <defs>\n        <clipPath id=\"cut-off-bottom\">\n          <circle cx=\"0\" cy=\"0\" r=\"12\"></circle>\n        </clipPath>\n      </defs>\n      <mask id=\"re8-clip\">\n        <circle cx=\"0\" cy=\"0\" r=\"20\" fill=\"white\"></circle>\n        <circle cx=\"0\" cy=\"0\" r=\"14\" fill=\"black\"></circle>\n      </mask>\n        <path *ngFor=\"let path of data\" [attr.d]=\"path.path\" [attr.fill]=\"path.color\"  mask=\"url(#re8-clip)\"></path>\n        <text x=\"0\" y=\"4\" text-anchor=\"middle\" fill=\"currentColor\">{{count}}</text>\n    </svg>\n</div>\n\n\n",
+            encapsulation: ViewEncapsulation.Emulated,
+            providers: [],
+            changeDetection: ChangeDetectionStrategy.OnPush,
+            styles: [".pie-block{width:40px;height:40px;color:var(--text-color)}.pie-block text{width:20px;height:20px;background:var(--colorBgLevel2);font-size:11px}.pie-block svg{width:40px;height:40px}"]
+        }),
+        __metadata("design:paramtypes", [TranslateService,
+            PieService,
+            ChangeDetectorRef])
+    ], ObjectPieComponent);
+    return ObjectPieComponent;
+}());
+
 var InsparkComponentsModule = /** @class */ (function () {
     function InsparkComponentsModule() {
     }
@@ -4100,7 +4213,8 @@ var InsparkComponentsModule = /** @class */ (function () {
                 RadiobuttonComponent,
                 ObjectTreeComponent,
                 ContentToggleComponent,
-                InputGroupComponent
+                InputGroupComponent,
+                ObjectPieComponent,
             ],
             exports: [
                 ButtonComponent,
@@ -4135,6 +4249,7 @@ var InsparkComponentsModule = /** @class */ (function () {
                 RadiobuttonComponent,
                 ObjectTreeComponent,
                 ContentToggleComponent,
+                ObjectPieComponent,
                 InputGroupComponent,
                 AutoCompleteComponentModule
             ],
@@ -4153,5 +4268,5 @@ var InsparkComponentsModule = /** @class */ (function () {
  * Generated bundle index. Do not edit.
  */
 
-export { AutoCompleteComponentModule, BreadcrumbComponent, ButtonComponent, CheckboxComponent, CommunicationService, ComponentContainerComponent, ContentToggleComponent, DropdownComponentModule, EmptyComponent, FileComponent, InlineMessageComponent, InputTextComponent, InsparkComponentsModule, InsparkDialogService, InsparkHeaderComponent, InsparkMessageService, InsparkStickyComponent, InsparkTemplate, LinkComponent, ModalInputTextComponent, ObjectTreeComponent, PanelComponent, PipesModule, PreloaderComponent, RadiobuttonComponent, SelectButtonComponent, SelectListComponent, StatusCircleComponent, SvgComponent, SwitcherComponent, TableComponentModule, TextareaComponent, ToolbarComponent, TooltipComponent, TreeTableComponentModule, DropdownItem as ɵa, DropdownComponent as ɵb, tableFactory as ɵc, TableComponent as ɵd, TreeTableComponent as ɵe, AutoCompleteComponent as ɵf, PropertyValuePipe as ɵg, ShortToFullWeekdayPipe as ɵh, NumToShortWeekdayPipe as ɵi, FormatNumToTime as ɵj, InDate as ɵk, SafeUrlPipe as ɵl, SortByPipe as ɵm, PrimengComponentsModule as ɵn, TableColumnsMultiselectComponent as ɵo, TableMenuOverlayComponent as ɵp, TableClickOutsideDirective as ɵq, InputGroupComponent as ɵr };
+export { AutoCompleteComponentModule, BreadcrumbComponent, ButtonComponent, CheckboxComponent, CommunicationService, ComponentContainerComponent, ContentToggleComponent, DropdownComponentModule, EmptyComponent, FileComponent, InlineMessageComponent, InputTextComponent, InsparkComponentsModule, InsparkDialogService, InsparkHeaderComponent, InsparkMessageService, InsparkStickyComponent, InsparkTemplate, LinkComponent, ModalInputTextComponent, ObjectTreeComponent, PanelComponent, PipesModule, PreloaderComponent, RadiobuttonComponent, SelectButtonComponent, SelectListComponent, StatusCircleComponent, SvgComponent, SwitcherComponent, TableComponentModule, TextareaComponent, ToolbarComponent, TooltipComponent, TreeTableComponentModule, DropdownItem as ɵa, DropdownComponent as ɵb, tableFactory as ɵc, TableComponent as ɵd, TreeTableComponent as ɵe, AutoCompleteComponent as ɵf, PropertyValuePipe as ɵg, ShortToFullWeekdayPipe as ɵh, NumToShortWeekdayPipe as ɵi, FormatNumToTime as ɵj, InDate as ɵk, SafeUrlPipe as ɵl, SortByPipe as ɵm, PrimengComponentsModule as ɵn, TableColumnsMultiselectComponent as ɵo, TableMenuOverlayComponent as ɵp, TableClickOutsideDirective as ɵq, InputGroupComponent as ɵr, ObjectPieComponent as ɵs, PieService as ɵt };
 //# sourceMappingURL=inspark-inspark-components.js.map