@alauda-fe/common
Version:
Alauda frontend team common codes.
84 lines • 13.6 kB
JavaScript
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { map, switchMap } from 'rxjs';
import { Md5 } from 'ts-md5';
import { ResourceSelectContextService } from '../../context.service';
import { AuthorizationStateService } from './../../../../authorization/state.service';
import * as i0 from "@angular/core";
import * as i1 from "./../../../../authorization/state.service";
import * as i2 from "../../context.service";
import * as i3 from "@alauda/ui";
import * as i4 from "@angular/common";
import * as i5 from "../../../../core/pipes/time.pipe";
import * as i6 from "../../../../translate/translate.pipe";
export class ResourceDashboardComponent {
constructor(auth, contextService) {
this.auth = auth;
this.contextService = contextService;
this.email$ = this.auth
.getTokenPayload()
.pipe(map(info => info.email));
this.user$ = this.email$.pipe(switchMap(email => this.contextService.getUser(Md5.hashStr(email).toString())));
}
static { this.ɵfac = function ResourceDashboardComponent_Factory(t) { return new (t || ResourceDashboardComponent)(i0.ɵɵdirectiveInject(i1.AuthorizationStateService), i0.ɵɵdirectiveInject(i2.ResourceSelectContextService)); }; }
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ResourceDashboardComponent, selectors: [["acl-resource-dashboard"]], inputs: { numbers: "numbers" }, decls: 32, vars: 22, consts: [[1, "dashboard"], [1, "user"], [1, "user__avatar"], ["src", "images/avatar.svg"], [1, "user__info"], [1, "with-colon"], [1, "stats"], [1, "stats__item"], ["icon", "bicolor:project", 1, "acl-colorful-icon", "highlight"], [1, "number"], ["icon", "bicolor:server", 1, "acl-colorful-icon", "highlight"]], template: function ResourceDashboardComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "span", 2);
i0.ɵɵelement(3, "img", 3);
i0.ɵɵelementEnd();
i0.ɵɵelementStart(4, "div", 4)(5, "span");
i0.ɵɵtext(6);
i0.ɵɵpipe(7, "translate");
i0.ɵɵpipe(8, "async");
i0.ɵɵelementEnd();
i0.ɵɵelementStart(9, "span")(10, "span", 5);
i0.ɵɵtext(11);
i0.ɵɵpipe(12, "translate");
i0.ɵɵelementEnd();
i0.ɵɵelementStart(13, "span");
i0.ɵɵtext(14);
i0.ɵɵpipe(15, "async");
i0.ɵɵpipe(16, "aclRelativeTime");
i0.ɵɵelementEnd()()()();
i0.ɵɵelementStart(17, "div", 6)(18, "span", 7);
i0.ɵɵelement(19, "aui-icon", 8);
i0.ɵɵelementStart(20, "span");
i0.ɵɵtext(21);
i0.ɵɵpipe(22, "translate");
i0.ɵɵelementEnd();
i0.ɵɵelementStart(23, "span", 9);
i0.ɵɵtext(24);
i0.ɵɵelementEnd()();
i0.ɵɵelementStart(25, "span", 7);
i0.ɵɵelement(26, "aui-icon", 10);
i0.ɵɵelementStart(27, "span");
i0.ɵɵtext(28);
i0.ɵɵpipe(29, "translate");
i0.ɵɵelementEnd();
i0.ɵɵelementStart(30, "span", 9);
i0.ɵɵtext(31);
i0.ɵɵelementEnd()()()();
} if (rf & 2) {
let tmp_2_0;
i0.ɵɵadvance(6);
i0.ɵɵtextInterpolate2(" ", i0.ɵɵpipeBind1(7, 8, "hello"), "", i0.ɵɵpipeBind1(8, 10, ctx.email$), " ");
i0.ɵɵadvance(5);
i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(12, 12, "last_login_time"));
i0.ɵɵadvance(3);
i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(16, 16, (tmp_2_0 = i0.ɵɵpipeBind1(15, 14, ctx.user$)) == null ? null : tmp_2_0.spec == null ? null : tmp_2_0.spec.last_login_time));
i0.ɵɵadvance(7);
i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(22, 18, "project_number"));
i0.ɵɵadvance(3);
i0.ɵɵtextInterpolate((ctx.numbers == null ? null : ctx.numbers.project) || 0);
i0.ɵɵadvance(4);
i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(29, 20, "cluster_number"));
i0.ɵɵadvance(3);
i0.ɵɵtextInterpolate((ctx.numbers == null ? null : ctx.numbers.cluster) || 0);
} }, dependencies: [i3.IconComponent, i4.AsyncPipe, i5.RelativeTimePipe, i6.TranslatePipe], styles: ["[_nghost-%COMP%]{display:block}.dashboard[_ngcontent-%COMP%]{height:100px;padding:20px;color:#fff;display:flex;border-radius:var(--aui-border-radius-l);background-color:rgb(var(--aui-color-primary));background-image:url(^images/overview-banner.svg);background-size:cover;background-position:center}.user[_ngcontent-%COMP%]{display:flex;margin-right:180px}.user__avatar[_ngcontent-%COMP%]{width:60px;height:60px;background-color:rgb(var(--aui-color-n-10));border-radius:50%;margin-right:20px}.user[_ngcontent-%COMP%] img[_ngcontent-%COMP%]{width:60px}.user__info[_ngcontent-%COMP%]{display:flex;flex-direction:column}.user__info[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{line-height:20px;font-size:12px}.user__info[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]:first-child{line-height:24px;font-size:18px;margin:6px 0 4px}.stats[_ngcontent-%COMP%]{font-size:14px;display:flex;align-items:center}.stats__item[_ngcontent-%COMP%]{margin-right:60px;display:flex;align-items:flex-end}.stats__item[_ngcontent-%COMP%] .number[_ngcontent-%COMP%]{font-size:36px;font-weight:500;margin-left:8px;line-height:1}.stats__item[_ngcontent-%COMP%] aui-icon[_ngcontent-%COMP%]{display:flex;margin-right:8px;width:32px;height:32px;font-size:32px}.with-colon[_ngcontent-%COMP%]:after{content:\":\";margin-right:8px}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ResourceDashboardComponent, [{
type: Component,
args: [{ selector: 'acl-resource-dashboard', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dashboard\">\n <div class=\"user\">\n <span class=\"user__avatar\">\n <img src=\"images/avatar.svg\" />\n </span>\n <div class=\"user__info\">\n <span> {{ 'hello' | translate }}{{ email$ | async }} </span>\n <span>\n <span class=\"with-colon\">{{ 'last_login_time' | translate }}</span>\n <span>{{\n (user$ | async)?.spec?.last_login_time | aclRelativeTime\n }}</span>\n </span>\n </div>\n </div>\n <div class=\"stats\">\n <span class=\"stats__item\">\n <aui-icon\n class=\"acl-colorful-icon highlight\"\n icon=\"bicolor:project\"\n ></aui-icon>\n <span>{{ 'project_number' | translate }}</span>\n <span class=\"number\">{{ numbers?.project || 0 }}</span>\n </span>\n <span class=\"stats__item\">\n <aui-icon\n class=\"acl-colorful-icon highlight\"\n icon=\"bicolor:server\"\n ></aui-icon>\n <span>{{ 'cluster_number' | translate }}</span>\n <span class=\"number\">{{ numbers?.cluster || 0 }}</span>\n </span>\n </div>\n</div>\n", styles: [":host{display:block}.dashboard{height:100px;padding:20px;color:#fff;display:flex;border-radius:var(--aui-border-radius-l);background-color:rgb(var(--aui-color-primary));background-image:url(^images/overview-banner.svg);background-size:cover;background-position:center}.user{display:flex;margin-right:180px}.user__avatar{width:60px;height:60px;background-color:rgb(var(--aui-color-n-10));border-radius:50%;margin-right:20px}.user img{width:60px}.user__info{display:flex;flex-direction:column}.user__info>span{line-height:20px;font-size:12px}.user__info>span:first-child{line-height:24px;font-size:18px;margin:6px 0 4px}.stats{font-size:14px;display:flex;align-items:center}.stats__item{margin-right:60px;display:flex;align-items:flex-end}.stats__item .number{font-size:36px;font-weight:500;margin-left:8px;line-height:1}.stats__item aui-icon{display:flex;margin-right:8px;width:32px;height:32px;font-size:32px}.with-colon:after{content:\":\";margin-right:8px}\n"] }]
}], () => [{ type: i1.AuthorizationStateService }, { type: i2.ResourceSelectContextService }], { numbers: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ResourceDashboardComponent, { className: "ResourceDashboardComponent" }); })();
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21tb24vc3JjL2J1c2luZXNzL3Jlc291cmNlLXNlbGVjdC9pbnRlcm5hbHMvcmVzb3VyY2UtZGFzaGJvYXJkL2NvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tbW9uL3NyYy9idXNpbmVzcy9yZXNvdXJjZS1zZWxlY3QvaW50ZXJuYWxzL3Jlc291cmNlLWRhc2hib2FyZC90ZW1wbGF0ZS5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzFFLE9BQU8sRUFBRSxHQUFHLEVBQUUsU0FBUyxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQ3RDLE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSxRQUFRLENBQUM7QUFHN0IsT0FBTyxFQUFFLDRCQUE0QixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFHckUsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sMkNBQTJDLENBQUM7Ozs7Ozs7O0FBUXRGLE1BQU0sT0FBTywwQkFBMEI7SUFjckMsWUFDbUIsSUFBK0IsRUFDL0IsY0FBNEM7UUFENUMsU0FBSSxHQUFKLElBQUksQ0FBMkI7UUFDL0IsbUJBQWMsR0FBZCxjQUFjLENBQThCO1FBWi9ELFdBQU0sR0FBRyxJQUFJLENBQUMsSUFBSTthQUNmLGVBQWUsRUFBZTthQUM5QixJQUFJLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7UUFFakMsVUFBSyxHQUFHLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUN0QixTQUFTLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FDaEIsSUFBSSxDQUFDLGNBQWMsQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQyxRQUFRLEVBQUUsQ0FBQyxDQUMzRCxDQUNGLENBQUM7SUFLQyxDQUFDOzJGQWpCTywwQkFBMEI7b0VBQTFCLDBCQUEwQjtZQ2RuQyxBQURGLEFBREYsOEJBQXVCLGFBQ0gsY0FDVztZQUN6Qix5QkFBK0I7WUFDakMsaUJBQU87WUFFTCxBQURGLDhCQUF3QixXQUNoQjtZQUFDLFlBQThDOzs7WUFBQSxpQkFBTztZQUUxRCxBQURGLDRCQUFNLGVBQ3FCO1lBQUEsYUFBbUM7O1lBQUEsaUJBQU87WUFDbkUsNkJBQU07WUFBQSxhQUVKOzs7WUFHUixBQURFLEFBREUsQUFESSxpQkFBTyxFQUNKLEVBQ0gsRUFDRjtZQUVKLEFBREYsK0JBQW1CLGVBQ1M7WUFDeEIsK0JBR1k7WUFDWiw2QkFBTTtZQUFBLGFBQWtDOztZQUFBLGlCQUFPO1lBQy9DLGdDQUFxQjtZQUFBLGFBQTJCO1lBQ2xELEFBRGtELGlCQUFPLEVBQ2xEO1lBQ1AsZ0NBQTBCO1lBQ3hCLGdDQUdZO1lBQ1osNkJBQU07WUFBQSxhQUFrQzs7WUFBQSxpQkFBTztZQUMvQyxnQ0FBcUI7WUFBQSxhQUEyQjtZQUd0RCxBQURFLEFBREUsQUFEa0QsaUJBQU8sRUFDbEQsRUFDSCxFQUNGOzs7WUEzQk8sZUFBOEM7WUFBOUMscUdBQThDO1lBRTFCLGVBQW1DO1lBQW5DLCtEQUFtQztZQUN0RCxlQUVKO1lBRkksdUtBRUo7WUFVRSxlQUFrQztZQUFsQyw4REFBa0M7WUFDbkIsZUFBMkI7WUFBM0IsNkVBQTJCO1lBTzFDLGVBQWtDO1lBQWxDLDhEQUFrQztZQUNuQixlQUEyQjtZQUEzQiw2RUFBMkI7OztpRkRkekMsMEJBQTBCO2NBTnRDLFNBQVM7MkJBQ0Usd0JBQXdCLG1CQUdqQix1QkFBdUIsQ0FBQyxNQUFNO3FHQUkvQyxPQUFPO2tCQUROLEtBQUs7O2tGQURLLDBCQUEwQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBtYXAsIHN3aXRjaE1hcCB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgTWQ1IH0gZnJvbSAndHMtbWQ1JztcblxuaW1wb3J0IHsgQWNjb3VudEluZm8gfSBmcm9tICcuLi8uLi8uLi8uLi9hdXRob3JpemF0aW9uL3B1YmxpYy1hcGknO1xuaW1wb3J0IHsgUmVzb3VyY2VTZWxlY3RDb250ZXh0U2VydmljZSB9IGZyb20gJy4uLy4uL2NvbnRleHQuc2VydmljZSc7XG5pbXBvcnQgeyBSZXNvdXJjZURhdGFOdW1iZXJzIH0gZnJvbSAnLi4vLi4vdHlwZXMnO1xuXG5pbXBvcnQgeyBBdXRob3JpemF0aW9uU3RhdGVTZXJ2aWNlIH0gZnJvbSAnLi8uLi8uLi8uLi8uLi9hdXRob3JpemF0aW9uL3N0YXRlLnNlcnZpY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdhY2wtcmVzb3VyY2UtZGFzaGJvYXJkJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3RlbXBsYXRlLmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9zdHlsZS5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBSZXNvdXJjZURhc2hib2FyZENvbXBvbmVudCB7XG4gIEBJbnB1dCgpXG4gIG51bWJlcnM6IFJlc291cmNlRGF0YU51bWJlcnM7XG5cbiAgZW1haWwkID0gdGhpcy5hdXRoXG4gICAgLmdldFRva2VuUGF5bG9hZDxBY2NvdW50SW5mbz4oKVxuICAgIC5waXBlKG1hcChpbmZvID0+IGluZm8uZW1haWwpKTtcblxuICB1c2VyJCA9IHRoaXMuZW1haWwkLnBpcGUoXG4gICAgc3dpdGNoTWFwKGVtYWlsID0+XG4gICAgICB0aGlzLmNvbnRleHRTZXJ2aWNlLmdldFVzZXIoTWQ1Lmhhc2hTdHIoZW1haWwpLnRvU3RyaW5nKCkpLFxuICAgICksXG4gICk7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSByZWFkb25seSBhdXRoOiBBdXRob3JpemF0aW9uU3RhdGVTZXJ2aWNlLFxuICAgIHByaXZhdGUgcmVhZG9ubHkgY29udGV4dFNlcnZpY2U6IFJlc291cmNlU2VsZWN0Q29udGV4dFNlcnZpY2UsXG4gICkge31cbn1cbiIsIjxkaXYgY2xhc3M9XCJkYXNoYm9hcmRcIj5cbiAgPGRpdiBjbGFzcz1cInVzZXJcIj5cbiAgICA8c3BhbiBjbGFzcz1cInVzZXJfX2F2YXRhclwiPlxuICAgICAgPGltZyBzcmM9XCJpbWFnZXMvYXZhdGFyLnN2Z1wiIC8+XG4gICAgPC9zcGFuPlxuICAgIDxkaXYgY2xhc3M9XCJ1c2VyX19pbmZvXCI+XG4gICAgICA8c3Bhbj4ge3sgJ2hlbGxvJyB8IHRyYW5zbGF0ZSB9fXt7IGVtYWlsJCB8IGFzeW5jIH19IDwvc3Bhbj5cbiAgICAgIDxzcGFuPlxuICAgICAgICA8c3BhbiBjbGFzcz1cIndpdGgtY29sb25cIj57eyAnbGFzdF9sb2dpbl90aW1lJyB8IHRyYW5zbGF0ZSB9fTwvc3Bhbj5cbiAgICAgICAgPHNwYW4+e3tcbiAgICAgICAgICAodXNlciQgfCBhc3luYyk/LnNwZWM/Lmxhc3RfbG9naW5fdGltZSB8IGFjbFJlbGF0aXZlVGltZVxuICAgICAgICB9fTwvc3Bhbj5cbiAgICAgIDwvc3Bhbj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJzdGF0c1wiPlxuICAgIDxzcGFuIGNsYXNzPVwic3RhdHNfX2l0ZW1cIj5cbiAgICAgIDxhdWktaWNvblxuICAgICAgICBjbGFzcz1cImFjbC1jb2xvcmZ1bC1pY29uIGhpZ2hsaWdodFwiXG4gICAgICAgIGljb249XCJiaWNvbG9yOnByb2plY3RcIlxuICAgICAgPjwvYXVpLWljb24+XG4gICAgICA8c3Bhbj57eyAncHJvamVjdF9udW1iZXInIHwgdHJhbnNsYXRlIH19PC9zcGFuPlxuICAgICAgPHNwYW4gY2xhc3M9XCJudW1iZXJcIj57eyBudW1iZXJzPy5wcm9qZWN0IHx8IDAgfX08L3NwYW4+XG4gICAgPC9zcGFuPlxuICAgIDxzcGFuIGNsYXNzPVwic3RhdHNfX2l0ZW1cIj5cbiAgICAgIDxhdWktaWNvblxuICAgICAgICBjbGFzcz1cImFjbC1jb2xvcmZ1bC1pY29uIGhpZ2hsaWdodFwiXG4gICAgICAgIGljb249XCJiaWNvbG9yOnNlcnZlclwiXG4gICAgICA+PC9hdWktaWNvbj5cbiAgICAgIDxzcGFuPnt7ICdjbHVzdGVyX251bWJlcicgfCB0cmFuc2xhdGUgfX08L3NwYW4+XG4gICAgICA8c3BhbiBjbGFzcz1cIm51bWJlclwiPnt7IG51bWJlcnM/LmNsdXN0ZXIgfHwgMCB9fTwvc3Bhbj5cbiAgICA8L3NwYW4+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=