UNPKG

@alauda-fe/common

Version:

Alauda frontend team common codes.

80 lines 13.4 kB
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"; 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); } }, 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,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21tb24vc3JjL2J1c2luZXNzL3Jlc291cmNlLXNlbGVjdC9pbnRlcm5hbHMvcmVzb3VyY2UtZGFzaGJvYXJkL2NvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tbW9uL3NyYy9idXNpbmVzcy9yZXNvdXJjZS1zZWxlY3QvaW50ZXJuYWxzL3Jlc291cmNlLWRhc2hib2FyZC90ZW1wbGF0ZS5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzFFLE9BQU8sRUFBRSxHQUFHLEVBQUUsU0FBUyxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQ3RDLE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSxRQUFRLENBQUM7QUFHN0IsT0FBTyxFQUFFLDRCQUE0QixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFHckUsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sMkNBQTJDLENBQUM7Ozs7QUFRdEYsTUFBTSxPQUFPLDBCQUEwQjtJQWNyQyxZQUNtQixJQUErQixFQUMvQixjQUE0QztRQUQ1QyxTQUFJLEdBQUosSUFBSSxDQUEyQjtRQUMvQixtQkFBYyxHQUFkLGNBQWMsQ0FBOEI7UUFaL0QsV0FBTSxHQUFHLElBQUksQ0FBQyxJQUFJO2FBQ2YsZUFBZSxFQUFlO2FBQzlCLElBQUksQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQztRQUVqQyxVQUFLLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQ3RCLFNBQVMsQ0FBQyxLQUFLLENBQUMsRUFBRSxDQUNoQixJQUFJLENBQUMsY0FBYyxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxDQUFDLFFBQVEsRUFBRSxDQUFDLENBQzNELENBQ0YsQ0FBQztJQUtDLENBQUM7MkZBakJPLDBCQUEwQjtvRUFBMUIsMEJBQTBCO1lDZG5DLEFBREYsQUFERiw4QkFBdUIsYUFDSCxjQUNXO1lBQ3pCLHlCQUErQjtZQUNqQyxpQkFBTztZQUVMLEFBREYsOEJBQXdCLFdBQ2hCO1lBQUMsWUFBOEM7OztZQUFBLGlCQUFPO1lBRTFELEFBREYsNEJBQU0sZUFDcUI7WUFBQSxhQUFtQzs7WUFBQSxpQkFBTztZQUNuRSw2QkFBTTtZQUFBLGFBRUo7OztZQUdSLEFBREUsQUFERSxBQURJLGlCQUFPLEVBQ0osRUFDSCxFQUNGO1lBRUosQUFERiwrQkFBbUIsZUFDUztZQUN4QiwrQkFHWTtZQUNaLDZCQUFNO1lBQUEsYUFBa0M7O1lBQUEsaUJBQU87WUFDL0MsZ0NBQXFCO1lBQUEsYUFBMkI7WUFDbEQsQUFEa0QsaUJBQU8sRUFDbEQ7WUFDUCxnQ0FBMEI7WUFDeEIsZ0NBR1k7WUFDWiw2QkFBTTtZQUFBLGFBQWtDOztZQUFBLGlCQUFPO1lBQy9DLGdDQUFxQjtZQUFBLGFBQTJCO1lBR3RELEFBREUsQUFERSxBQURrRCxpQkFBTyxFQUNsRCxFQUNILEVBQ0Y7OztZQTNCTyxlQUE4QztZQUE5QyxxR0FBOEM7WUFFMUIsZUFBbUM7WUFBbkMsK0RBQW1DO1lBQ3RELGVBRUo7WUFGSSx1S0FFSjtZQVVFLGVBQWtDO1lBQWxDLDhEQUFrQztZQUNuQixlQUEyQjtZQUEzQiw2RUFBMkI7WUFPMUMsZUFBa0M7WUFBbEMsOERBQWtDO1lBQ25CLGVBQTJCO1lBQTNCLDZFQUEyQjs7O2lGRGR6QywwQkFBMEI7Y0FOdEMsU0FBUzsyQkFDRSx3QkFBd0IsbUJBR2pCLHVCQUF1QixDQUFDLE1BQU07cUdBSS9DLE9BQU87a0JBRE4sS0FBSzs7a0ZBREssMEJBQTBCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IG1hcCwgc3dpdGNoTWFwIH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBNZDUgfSBmcm9tICd0cy1tZDUnO1xuXG5pbXBvcnQgeyBBY2NvdW50SW5mbyB9IGZyb20gJy4uLy4uLy4uLy4uL3BhZ2Utc2NhZmZvbGQvcHVibGljLWFwaSc7XG5pbXBvcnQgeyBSZXNvdXJjZVNlbGVjdENvbnRleHRTZXJ2aWNlIH0gZnJvbSAnLi4vLi4vY29udGV4dC5zZXJ2aWNlJztcbmltcG9ydCB7IFJlc291cmNlRGF0YU51bWJlcnMgfSBmcm9tICcuLi8uLi90eXBlcyc7XG5cbmltcG9ydCB7IEF1dGhvcml6YXRpb25TdGF0ZVNlcnZpY2UgfSBmcm9tICcuLy4uLy4uLy4uLy4uL2F1dGhvcml6YXRpb24vc3RhdGUuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2FjbC1yZXNvdXJjZS1kYXNoYm9hcmQnLFxuICB0ZW1wbGF0ZVVybDogJy4vdGVtcGxhdGUuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3N0eWxlLnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIFJlc291cmNlRGFzaGJvYXJkQ29tcG9uZW50IHtcbiAgQElucHV0KClcbiAgbnVtYmVyczogUmVzb3VyY2VEYXRhTnVtYmVycztcblxuICBlbWFpbCQgPSB0aGlzLmF1dGhcbiAgICAuZ2V0VG9rZW5QYXlsb2FkPEFjY291bnRJbmZvPigpXG4gICAgLnBpcGUobWFwKGluZm8gPT4gaW5mby5lbWFpbCkpO1xuXG4gIHVzZXIkID0gdGhpcy5lbWFpbCQucGlwZShcbiAgICBzd2l0Y2hNYXAoZW1haWwgPT5cbiAgICAgIHRoaXMuY29udGV4dFNlcnZpY2UuZ2V0VXNlcihNZDUuaGFzaFN0cihlbWFpbCkudG9TdHJpbmcoKSksXG4gICAgKSxcbiAgKTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIHJlYWRvbmx5IGF1dGg6IEF1dGhvcml6YXRpb25TdGF0ZVNlcnZpY2UsXG4gICAgcHJpdmF0ZSByZWFkb25seSBjb250ZXh0U2VydmljZTogUmVzb3VyY2VTZWxlY3RDb250ZXh0U2VydmljZSxcbiAgKSB7fVxufVxuIiwiPGRpdiBjbGFzcz1cImRhc2hib2FyZFwiPlxuICA8ZGl2IGNsYXNzPVwidXNlclwiPlxuICAgIDxzcGFuIGNsYXNzPVwidXNlcl9fYXZhdGFyXCI+XG4gICAgICA8aW1nIHNyYz1cImltYWdlcy9hdmF0YXIuc3ZnXCIgLz5cbiAgICA8L3NwYW4+XG4gICAgPGRpdiBjbGFzcz1cInVzZXJfX2luZm9cIj5cbiAgICAgIDxzcGFuPiB7eyAnaGVsbG8nIHwgdHJhbnNsYXRlIH19e3sgZW1haWwkIHwgYXN5bmMgfX0gPC9zcGFuPlxuICAgICAgPHNwYW4+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwid2l0aC1jb2xvblwiPnt7ICdsYXN0X2xvZ2luX3RpbWUnIHwgdHJhbnNsYXRlIH19PC9zcGFuPlxuICAgICAgICA8c3Bhbj57e1xuICAgICAgICAgICh1c2VyJCB8IGFzeW5jKT8uc3BlYz8ubGFzdF9sb2dpbl90aW1lIHwgYWNsUmVsYXRpdmVUaW1lXG4gICAgICAgIH19PC9zcGFuPlxuICAgICAgPC9zcGFuPlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbiAgPGRpdiBjbGFzcz1cInN0YXRzXCI+XG4gICAgPHNwYW4gY2xhc3M9XCJzdGF0c19faXRlbVwiPlxuICAgICAgPGF1aS1pY29uXG4gICAgICAgIGNsYXNzPVwiYWNsLWNvbG9yZnVsLWljb24gaGlnaGxpZ2h0XCJcbiAgICAgICAgaWNvbj1cImJpY29sb3I6cHJvamVjdFwiXG4gICAgICA+PC9hdWktaWNvbj5cbiAgICAgIDxzcGFuPnt7ICdwcm9qZWN0X251bWJlcicgfCB0cmFuc2xhdGUgfX08L3NwYW4+XG4gICAgICA8c3BhbiBjbGFzcz1cIm51bWJlclwiPnt7IG51bWJlcnM/LnByb2plY3QgfHwgMCB9fTwvc3Bhbj5cbiAgICA8L3NwYW4+XG4gICAgPHNwYW4gY2xhc3M9XCJzdGF0c19faXRlbVwiPlxuICAgICAgPGF1aS1pY29uXG4gICAgICAgIGNsYXNzPVwiYWNsLWNvbG9yZnVsLWljb24gaGlnaGxpZ2h0XCJcbiAgICAgICAgaWNvbj1cImJpY29sb3I6c2VydmVyXCJcbiAgICAgID48L2F1aS1pY29uPlxuICAgICAgPHNwYW4+e3sgJ2NsdXN0ZXJfbnVtYmVyJyB8IHRyYW5zbGF0ZSB9fTwvc3Bhbj5cbiAgICAgIDxzcGFuIGNsYXNzPVwibnVtYmVyXCI+e3sgbnVtYmVycz8uY2x1c3RlciB8fCAwIH19PC9zcGFuPlxuICAgIDwvc3Bhbj5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==