@rolatech/angular-components 17.2.53 → 17.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/angular-components.module.mjs +4 -4
- package/esm2022/lib/app-container/app-container.component.mjs +3 -3
- package/esm2022/lib/app-container-content/app-container-content.component.mjs +3 -3
- package/esm2022/lib/app-drawer/app-drawer.component.mjs +3 -3
- package/esm2022/lib/app-footer/app-footer.component.mjs +3 -3
- package/esm2022/lib/app-layout/app-layout.component.mjs +3 -3
- package/esm2022/lib/app-page/app-page.component.mjs +3 -3
- package/esm2022/lib/confirmation-dialog/confirmation-dialog.component.mjs +3 -3
- package/esm2022/lib/console-layout/console-layout.component.mjs +3 -3
- package/esm2022/lib/folder/folder.component.mjs +3 -3
- package/esm2022/lib/icon/icon.component.mjs +3 -3
- package/esm2022/lib/icon-button/icon-button.component.mjs +3 -3
- package/esm2022/lib/image/image.component.mjs +3 -3
- package/esm2022/lib/material.module.mjs +4 -4
- package/esm2022/lib/media-list/media-list.component.mjs +3 -3
- package/esm2022/lib/media-list-item/media-list-item.component.mjs +3 -3
- package/esm2022/lib/media-preview/media-preview.component.mjs +3 -3
- package/esm2022/lib/media-preview-dialog/media-preview-dialog.component.mjs +3 -3
- package/esm2022/lib/media-upload/media-upload.component.mjs +3 -3
- package/esm2022/lib/media-upload-dialog/media-upload-dialog.component.mjs +3 -3
- package/esm2022/lib/menu-user/menu-user.component.mjs +3 -3
- package/esm2022/lib/mini-guide/mini-guide.component.mjs +3 -3
- package/esm2022/lib/not-found/not-found.component.mjs +3 -3
- package/esm2022/lib/paginator/paginator.component.mjs +3 -3
- package/esm2022/lib/spacer/spacer.component.mjs +3 -3
- package/esm2022/lib/spinner/spinner.component.mjs +3 -3
- package/esm2022/lib/storage-bucket-create/storage-bucket-create.component.mjs +3 -3
- package/esm2022/lib/storage-file-upload/storage-file-upload.component.mjs +3 -3
- package/esm2022/lib/storage-folder-create/storage-folder-create.component.mjs +3 -3
- package/esm2022/lib/tab/tab.component.mjs +5 -5
- package/esm2022/lib/table/table.component.mjs +3 -3
- package/esm2022/lib/tabs/tabs.component.mjs +12 -8
- package/esm2022/lib/thumbnail/thumbnail.component.mjs +3 -3
- package/esm2022/lib/title/title.component.mjs +3 -3
- package/esm2022/lib/toolbar/toolbar.component.mjs +3 -3
- package/esm2022/lib/topbar/topbar.component.mjs +3 -3
- package/esm2022/lib/topbar-avatar-menu/topbar-avatar-menu.component.mjs +3 -3
- package/esm2022/lib/wechat-connect-dialog/wechat-connect-dialog.component.mjs +3 -3
- package/fesm2022/rolatech-angular-components.mjs +125 -121
- package/fesm2022/rolatech-angular-components.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -84,10 +84,10 @@ class IconComponent {
|
|
|
84
84
|
}
|
|
85
85
|
});
|
|
86
86
|
}
|
|
87
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
88
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.
|
|
87
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
88
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.3", type: IconComponent, isStandalone: true, selector: "rolatech-icon", inputs: { filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-icon": "this.hasClass" } }, ngImport: i0, template: "<mat-icon>\n <ng-content></ng-content>\n</mat-icon>\n", styles: [".rolatech-icon{display:inline-flex;align-items:center;justify-content:center;position:relative;vertical-align:middle;width:var(--rolatech-icon-width, 24px);height:var(--rolatech-icon-height, 24px)}.rolatech-icon mat-icon{font-family:Material Symbols Rounded}.rolatech-icon[filled] mat-icon{font-family:Material Symbols Rounded Filled}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
89
89
|
}
|
|
90
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
90
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: IconComponent, decorators: [{
|
|
91
91
|
type: Component,
|
|
92
92
|
args: [{ selector: 'rolatech-icon', standalone: true, imports: [CommonModule, MatIcon], encapsulation: ViewEncapsulation.None, template: "<mat-icon>\n <ng-content></ng-content>\n</mat-icon>\n", styles: [".rolatech-icon{display:inline-flex;align-items:center;justify-content:center;position:relative;vertical-align:middle;width:var(--rolatech-icon-width, 24px);height:var(--rolatech-icon-height, 24px)}.rolatech-icon mat-icon{font-family:Material Symbols Rounded}.rolatech-icon[filled] mat-icon{font-family:Material Symbols Rounded Filled}\n"] }]
|
|
93
93
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
@@ -97,10 +97,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
|
|
|
97
97
|
|
|
98
98
|
class IconButtonComponent {
|
|
99
99
|
hasClass = true;
|
|
100
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
101
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
100
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
101
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: IconButtonComponent, isStandalone: true, selector: "rolatech-icon-button", host: { properties: { "class.rolatech-icon-button": "this.hasClass" } }, ngImport: i0, template: "<button\n id=\"button\"\n class=\"w-10 h-10 p-2 inline-block relative cursor-pointer hover:bg-gray-100 rounded-full rolatech-icon-button\"\n onclick=\"this.blur()\"\n>\n <!-- <ng-content select=\"rolatech-icon\"></ng-content> -->\n <rolatech-icon>\n <ng-content></ng-content>\n </rolatech-icon>\n</button>\n", styles: [".rolatech-icon-button{--rolatech-icon-button-icon-width: 24px;--rolatech-icon-button-icon-height: 24px;color:var(--rolatech-spec-icon-active-other);width:40px;height:40px;box-sizing:border-box;display:block}button.rolatech-icon-button{vertical-align:middle;color:inherit;outline:none;background:none;margin:0;border:none;padding:0;width:100%;height:100%;line-height:0;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
102
102
|
}
|
|
103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
104
104
|
type: Component,
|
|
105
105
|
args: [{ selector: 'rolatech-icon-button', standalone: true, imports: [CommonModule, IconComponent], encapsulation: ViewEncapsulation.None, template: "<button\n id=\"button\"\n class=\"w-10 h-10 p-2 inline-block relative cursor-pointer hover:bg-gray-100 rounded-full rolatech-icon-button\"\n onclick=\"this.blur()\"\n>\n <!-- <ng-content select=\"rolatech-icon\"></ng-content> -->\n <rolatech-icon>\n <ng-content></ng-content>\n </rolatech-icon>\n</button>\n", styles: [".rolatech-icon-button{--rolatech-icon-button-icon-width: 24px;--rolatech-icon-button-icon-height: 24px;color:var(--rolatech-spec-icon-active-other);width:40px;height:40px;box-sizing:border-box;display:block}button.rolatech-icon-button{vertical-align:middle;color:inherit;outline:none;background:none;margin:0;border:none;padding:0;width:100%;height:100%;line-height:0;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}\n"] }]
|
|
106
106
|
}], propDecorators: { hasClass: [{
|
|
@@ -111,20 +111,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
|
|
|
111
111
|
class TitleComponent {
|
|
112
112
|
title = input();
|
|
113
113
|
subtitle = input();
|
|
114
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
115
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.
|
|
114
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
115
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.3", type: TitleComponent, isStandalone: true, selector: "rolatech-title", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<!-- <a class=\"block text-xl font-medium py-3 cursor-pointer\">\n <ng-content></ng-content>\n</a> -->\n<div class=\"flex flex-row items-center\">\n <a class=\"block text-xl font-medium py-3\"\n ><span>{{ title() }}</span></a\n >\n <a class=\"text-sm leading-3 text-gray-500\"\n ><span>{{ subtitle() }}</span></a\n >\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
116
116
|
}
|
|
117
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
117
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TitleComponent, decorators: [{
|
|
118
118
|
type: Component,
|
|
119
119
|
args: [{ selector: 'rolatech-title', standalone: true, imports: [CommonModule], template: "<!-- <a class=\"block text-xl font-medium py-3 cursor-pointer\">\n <ng-content></ng-content>\n</a> -->\n<div class=\"flex flex-row items-center\">\n <a class=\"block text-xl font-medium py-3\"\n ><span>{{ title() }}</span></a\n >\n <a class=\"text-sm leading-3 text-gray-500\"\n ><span>{{ subtitle() }}</span></a\n >\n</div>\n" }]
|
|
120
120
|
}] });
|
|
121
121
|
|
|
122
122
|
class AppContainerComponent {
|
|
123
123
|
hasClass = true;
|
|
124
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
125
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
124
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
125
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: AppContainerComponent, isStandalone: true, selector: "rolatech-app-container", host: { properties: { "class.rolatech-app-container": "this.hasClass" } }, ngImport: i0, template: "<div class=\"px-4 xl:max-w-[1024px] 2xl:max-w-[1280px] m-auto\">\n <ng-content></ng-content>\n</div>\n", styles: ["@media (min-width: 1280){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1024px);margin:0 auto;padding:0 16px}}@media (min-width: 1536px){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1280px);margin:0 auto;padding:0 16px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
126
126
|
}
|
|
127
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
127
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppContainerComponent, decorators: [{
|
|
128
128
|
type: Component,
|
|
129
129
|
args: [{ selector: 'rolatech-app-container', standalone: true, imports: [CommonModule], template: "<div class=\"px-4 xl:max-w-[1024px] 2xl:max-w-[1280px] m-auto\">\n <ng-content></ng-content>\n</div>\n", styles: ["@media (min-width: 1280){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1024px);margin:0 auto;padding:0 16px}}@media (min-width: 1536px){.rolatech-app-container{max-width:var(--rolatech-app-container-max-width, 1280px);margin:0 auto;padding:0 16px}}\n"] }]
|
|
130
130
|
}], propDecorators: { hasClass: [{
|
|
@@ -133,10 +133,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
|
|
|
133
133
|
}] } });
|
|
134
134
|
|
|
135
135
|
class AppContainerContentComponent {
|
|
136
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
137
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
136
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppContainerContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
137
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: AppContainerContentComponent, isStandalone: true, selector: "rolatech-app-container-content", ngImport: i0, template: "<div>\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatSidenavModule }] });
|
|
138
138
|
}
|
|
139
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
139
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppContainerContentComponent, decorators: [{
|
|
140
140
|
type: Component,
|
|
141
141
|
args: [{ selector: 'rolatech-app-container-content', standalone: true, imports: [CommonModule, MatSidenavModule], template: "<div>\n <ng-content></ng-content>\n</div>\n" }]
|
|
142
142
|
}] });
|
|
@@ -196,10 +196,10 @@ class TopbarComponent {
|
|
|
196
196
|
}
|
|
197
197
|
this.appDrawer.toggle();
|
|
198
198
|
}
|
|
199
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
200
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
199
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
200
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: TopbarComponent, isStandalone: true, selector: "rolatech-topbar", host: { properties: { "id": "this.hostId", "class.rolatech-topbar": "this.hasClass" } }, ngImport: i0, template: "<div class=\"h-14 px-2 sm:px-4 flex items-center\">\n @if (persistent || (isHandset$ | async)) {\n <rolatech-icon-button id=\"topbar-menu-button\" (click)=\"onToggle()\">menu</rolatech-icon-button>\n }\n <div id=\"title\" class=\"cursor-pointer\" routerLink=\"/\">\n <div class=\"text-black text-lg sm:text-xl font-bold\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <ng-content></ng-content>\n</div>\n", styles: ["rolatech-topbar{position:fixed;top:0;width:100%;z-index:900;transform:translateY(0);transition:transform .3s ease;background:var(--rolatech-topbar-background-color, #fff);color:var(--rolatech-topbar-color, #000)}rolatech-topbar:not(:has(#topbar-menu-button)) #title{padding-left:16px}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-topbar{margin-left:256px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: IconButtonComponent, selector: "rolatech-icon-button" }, { kind: "ngmodule", type: MatButtonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
201
201
|
}
|
|
202
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
202
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TopbarComponent, decorators: [{
|
|
203
203
|
type: Component,
|
|
204
204
|
args: [{ selector: 'rolatech-topbar', standalone: true, imports: [CommonModule, RouterLink, IconButtonComponent, MatButtonModule, MatIcon], encapsulation: ViewEncapsulation.None, template: "<div class=\"h-14 px-2 sm:px-4 flex items-center\">\n @if (persistent || (isHandset$ | async)) {\n <rolatech-icon-button id=\"topbar-menu-button\" (click)=\"onToggle()\">menu</rolatech-icon-button>\n }\n <div id=\"title\" class=\"cursor-pointer\" routerLink=\"/\">\n <div class=\"text-black text-lg sm:text-xl font-bold\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <ng-content></ng-content>\n</div>\n", styles: ["rolatech-topbar{position:fixed;top:0;width:100%;z-index:900;transform:translateY(0);transition:transform .3s ease;background:var(--rolatech-topbar-background-color, #fff);color:var(--rolatech-topbar-color, #000)}rolatech-topbar:not(:has(#topbar-menu-button)) #title{padding-left:16px}rolatech-app-layout rolatech-app-drawer[persistent][opened]~rolatech-topbar{margin-left:256px}\n"] }]
|
|
205
205
|
}], ctorParameters: () => [], propDecorators: { hostId: [{
|
|
@@ -315,10 +315,10 @@ class AppDrawerComponent {
|
|
|
315
315
|
});
|
|
316
316
|
}
|
|
317
317
|
}
|
|
318
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
319
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
318
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
319
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: AppDrawerComponent, isStandalone: true, selector: "rolatech-app-drawer", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hostId", "class.rolatech-app-drawer": "this.hasClass", "style.transition-duration": "this.duration" } }, viewQueries: [{ propertyName: "guideEl", first: true, predicate: ["guide"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "scrimEl", first: true, predicate: ["scrim"], descendants: true, isSignal: true }, { propertyName: "headerEl", first: true, predicate: ["header"], descendants: true, isSignal: true }], ngImport: i0, template: "<div id=\"scrim\" #scrim class=\"tp-rolatech-app-drawer\" (click)=\"close()\"></div>\n<div id=\"contentContainer\" #content class=\"tp-rolatech-app-drawer\">\n <div id=\"guide-wrapper\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-icon-button #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\">menu</rolatech-icon-button>\n <div class=\"text-black text-lg sm:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"flex flex-col rolatech-app\">\n @if (completed) {\n <div class=\"flex p-3 flex-col gap-2\">\n @for (item of links(); track $index) {\n @if (item.children) {\n <div class=\"cursor-pointer\">\n <div class=\"flex items-center h-11 mr-2\" (click)=\"panelOpenState = !panelOpenState\">\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n <span class=\"ml-3\">{{ item.title }}</span>\n <div class=\"flex-1\"></div>\n <rolatech-icon\n style=\"transition-duration:.5s;transform: {{ panelOpenState ? 'rotate(180deg)' : 'rotate(0deg)' }};\"\n >expand_more</rolatech-icon\n >\n </div>\n <div class=\"flex flex-col pl-8\" [@heightAnimation]=\"panelOpenState === true ? 'open' : 'closed'\">\n @for (child of item.children; track child) {\n <a\n [routerLink]=\"child.link\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n class=\"p-3\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <span class=\"text-sm\">{{ child.title }}</span>\n </a>\n }\n </div>\n </div>\n } @else {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [href]=\"item.link\"\n target=\"_blank\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm opacity-75\">{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n <a\n class=\"flex hover:bg-gray-100 min-h-11\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\" [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n }\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-app-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility}rolatech-app-drawer[persistent]{width:var(--app-drawer-width, 256px)}rolatech-app-drawer[persistent][position=top]{width:100%}rolatech-app-drawer[opened]{visibility:visible}rolatech-app-drawer:not(:has(#drawer-menu-button)){padding-left:16px}rolatech-app-drawer[position=top] #contentContainer{left:0;right:0;width:100%;height:var(--app-topbar-height, 56px);transform:translate3d(0,-100%,0)}rolatech-app-drawer[position=top] #contentContainer #guide-inner-content{height:56px}rolatech-app-drawer[position=top] #contentContainer #guide-inner-content div{display:flex!important;flex-direction:row!important;overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin;height:56px;align-items:center}rolatech-app-drawer[position=bottom] #contentContainer{left:0;right:0;transform:translate3d(0,100%,0)}rolatech-app-drawer[position=left] #contentContainer{left:0;transform:translate3d(-100%,0,0)}rolatech-app-drawer[position=right] #contentContainer{right:0;transform:translate3d(100%,0,0)}rolatech-app-drawer[persistent][position=left]{right:auto}rolatech-app-drawer[persistent][position=right]{left:auto}rolatech-app-drawer[persistent][position=top] #contentContainer{transform:translate3d(0,-100%,0)}rolatech-app-drawer[persistent][position=left] #contentContainer{transform:translate3d(-100%,0,0)}rolatech-app-drawer[persistent][position=right] #contentContainer{transform:translate3d(100%,0,0)}rolatech-app-drawer[persistent][position=top] #contentContainer[opened]{transform:translateZ(0)}rolatech-app-drawer[persistent][position=left] #contentContainer[opened]{transform:translateZ(0)}rolatech-app-drawer[persistent][position=right] #contentContainer[opened]{transform:translateZ(0)}[hidden]{display:none!important}#contentContainer.tp-rolatech-app-drawer{position:absolute;top:0;bottom:0;width:var(--app-drawer-width, 256px);padding:var(--app-drawer-content-padding, 120px 0);transition-property:transform;transition-duration:0ms;background-color:#fff;background-color:var(--app-drawer-content-container-background-color, white)}#contentContainer.tp-rolatech-app-drawer[opened]{transform:translateZ(0)}#guide-inner-content.rolatech-app{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.tp-rolatech-app-drawer{position:absolute;inset:0;transition-property:opacity;transform:translateZ(0);transition-duration:.2s;opacity:0;background:var(--app-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.tp-rolatech-app-drawer{opacity:1}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-app-drawer:not([persistent]) #guide-spacer{display:none}rolatech-app-drawer:not([persistent]){z-index:2030}.drawer-active{background-color:#0000000d;border-radius:8px;font-weight:500}.content{display:flex;flex-direction:column;overflow:visible}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: IconButtonComponent, selector: "rolatech-icon-button" }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }], animations: [heightAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
320
320
|
}
|
|
321
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
321
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppDrawerComponent, decorators: [{
|
|
322
322
|
type: Component,
|
|
323
323
|
args: [{ selector: 'rolatech-app-drawer', standalone: true, imports: [
|
|
324
324
|
CommonModule,
|
|
@@ -398,10 +398,10 @@ class MiniGuideComponent {
|
|
|
398
398
|
}
|
|
399
399
|
this.opened ? this.close() : this.open();
|
|
400
400
|
}
|
|
401
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
402
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
401
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MiniGuideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
402
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: MiniGuideComponent, isStandalone: true, selector: "rolatech-mini-guide", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hasId", "class.rolatech-mini-guide": "this.hasClass" } }, ngImport: i0, template: "<div id=\"items\" class=\"w-16 mt-[6px]\" style=\"transition-duration: 200ms\">\n @for (item of items(); track $index) {\n <div>\n <a\n [routerLink]=\"item.link\"\n routerLinkActive=\"min-guide-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n class=\"flex flex-col justify-center items-center py-4\"\n >\n <rolatech-icon [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n @if (title()) {\n <span class=\"text-xs mt-1 max-w-full truncate\">{{ item.title }}</span>\n }\n </a>\n </div>\n }\n</div>\n", styles: [".rolatech-mini-guide{position:fixed;left:0;top:var(--rolatech-toolbar-height, 56px);bottom:0;width:var(--rolatech-mini-guide-width, 72px);box-sizing:border-box;display:inline-block;background-color:var(--rolatech-spec-base-background, #fff);z-index:2028;padding:0 4px}.min-guide-active{background-color:#0000000d;border-radius:8px;font-weight:500}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
403
403
|
}
|
|
404
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
404
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MiniGuideComponent, decorators: [{
|
|
405
405
|
type: Component,
|
|
406
406
|
args: [{ selector: 'rolatech-mini-guide', standalone: true, imports: [CommonModule, IconButtonComponent, IconComponent, RouterLink, RouterLinkActive], encapsulation: ViewEncapsulation.None, template: "<div id=\"items\" class=\"w-16 mt-[6px]\" style=\"transition-duration: 200ms\">\n @for (item of items(); track $index) {\n <div>\n <a\n [routerLink]=\"item.link\"\n routerLinkActive=\"min-guide-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n class=\"flex flex-col justify-center items-center py-4\"\n >\n <rolatech-icon [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n @if (title()) {\n <span class=\"text-xs mt-1 max-w-full truncate\">{{ item.title }}</span>\n }\n </a>\n </div>\n }\n</div>\n", styles: [".rolatech-mini-guide{position:fixed;left:0;top:var(--rolatech-toolbar-height, 56px);bottom:0;width:var(--rolatech-mini-guide-width, 72px);box-sizing:border-box;display:inline-block;background-color:var(--rolatech-spec-base-background, #fff);z-index:2028;padding:0 4px}.min-guide-active{background-color:#0000000d;border-radius:8px;font-weight:500}\n"] }]
|
|
407
407
|
}], propDecorators: { hasId: [{
|
|
@@ -469,10 +469,10 @@ class AppLayoutComponent {
|
|
|
469
469
|
this.renderer.removeAttribute(this.el.nativeElement, 'mini-guide-visible');
|
|
470
470
|
}
|
|
471
471
|
}
|
|
472
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
473
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.
|
|
472
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
473
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.3", type: AppLayoutComponent, isStandalone: true, selector: "rolatech-app-layout", host: { properties: { "id": "this.hostId", "class.rolatech-app-layout": "this.hasClass" } }, queries: [{ propertyName: "topbar", first: true, predicate: TopbarComponent, descendants: true, isSignal: true }, { propertyName: "drawer", first: true, predicate: AppDrawerComponent, descendants: true, isSignal: true }, { propertyName: "guide", first: true, predicate: MiniGuideComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"rolatech-topbar\"></ng-content>\n<ng-content select=\"rolatech-app-drawer\"></ng-content>\n<ng-content select=\"rolatech-mini-guide\"></ng-content>\n<ng-content select=\"rolatech-app-page\"></ng-content>\n<div class=\"flex-1\"></div>\n<ng-content select=\"rolatech-app-footer\"></ng-content>\n", styles: ["rolatech-app-layout{display:flex;flex-direction:column;height:100%}rolatech-app-layout rolatech-app-drawer[persistent][opened][position=top]~rolatech-app-page{margin-top:56px}rolatech-app-layout rolatech-app-drawer[persistent][opened][position=left]~rolatech-app-page{margin-left:256px}rolatech-app-layout rolatech-app-drawer[persistent][opened][position=right]~rolatech-app-page{margin-right:256px}rolatech-app-layout rolatech-mini-guide[mini-guide-visible]~rolatech-app-page{margin-left:var(--rolatech-mini-guide-width, 72px)}rolatech-app-page{display:block;padding-top:56px}rolatech-app-page[mini-guide-visible] .content{margin-left:72px}rolatech-app-layout[mini-guide-visible] rolatech-app-page.ytd-app{margin-left:var(--ytd-mini-guide-width, 72px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatSidenavModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
474
474
|
}
|
|
475
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
475
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppLayoutComponent, decorators: [{
|
|
476
476
|
type: Component,
|
|
477
477
|
args: [{ selector: 'rolatech-app-layout', standalone: true, imports: [
|
|
478
478
|
CommonModule,
|
|
@@ -501,10 +501,10 @@ class AppPageComponent {
|
|
|
501
501
|
hostId = 'rolatech-app-page';
|
|
502
502
|
hasClass = true;
|
|
503
503
|
hasAppClass = true;
|
|
504
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
505
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
504
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
505
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: AppPageComponent, isStandalone: true, selector: "rolatech-app-page", host: { properties: { "id": "this.hostId", "class.rolatech-app-page": "this.hasClass", "class.ytd-app": "this.hasAppClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
506
506
|
}
|
|
507
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
507
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppPageComponent, decorators: [{
|
|
508
508
|
type: Component,
|
|
509
509
|
args: [{ selector: 'rolatech-app-page', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
|
|
510
510
|
}], propDecorators: { hostId: [{
|
|
@@ -524,10 +524,10 @@ class AppFooterComponent {
|
|
|
524
524
|
config = inject(APP_CONFIG);
|
|
525
525
|
title = input();
|
|
526
526
|
copyright = input('');
|
|
527
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
528
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.
|
|
527
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
528
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.3", type: AppFooterComponent, isStandalone: true, selector: "rolatech-app-footer", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, copyright: { classPropertyName: "copyright", publicName: "copyright", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hostId", "class.rolatech-app-footer": "this.hasClass" } }, ngImport: i0, template: "<div class=\"bg-gray-100 text-black flex flex-col justify-between px-5 sm:px-16 py-6\">\n <div class=\"flex flex-col sm:flex-row sm:gap-10 gap-3 py-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"flex justify-between mt-6\">\n <div class=\"cursor-pointer\">\n <a href=\"/\" target=\"_blank\" class=\"text-lg font-bold\">{{ title() }}</a>\n </div>\n <span class=\"text-sm font-thin\">\u00A9{{ copyright() }}</span>\n </div>\n</div>\n", styles: [".rolatech-app-footer{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
529
529
|
}
|
|
530
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
530
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AppFooterComponent, decorators: [{
|
|
531
531
|
type: Component,
|
|
532
532
|
args: [{ selector: 'rolatech-app-footer', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"bg-gray-100 text-black flex flex-col justify-between px-5 sm:px-16 py-6\">\n <div class=\"flex flex-col sm:flex-row sm:gap-10 gap-3 py-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"flex justify-between mt-6\">\n <div class=\"cursor-pointer\">\n <a href=\"/\" target=\"_blank\" class=\"text-lg font-bold\">{{ title() }}</a>\n </div>\n <span class=\"text-sm font-thin\">\u00A9{{ copyright() }}</span>\n </div>\n</div>\n", styles: [".rolatech-app-footer{width:100%}\n"] }]
|
|
533
533
|
}], propDecorators: { hostId: [{
|
|
@@ -539,10 +539,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
|
|
|
539
539
|
}] } });
|
|
540
540
|
|
|
541
541
|
class ConsoleLayoutComponent {
|
|
542
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
543
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
542
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ConsoleLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
543
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: ConsoleLayoutComponent, isStandalone: true, selector: "rolatech-console-layout", ngImport: i0, template: "<p>console-layout works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
544
544
|
}
|
|
545
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
545
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ConsoleLayoutComponent, decorators: [{
|
|
546
546
|
type: Component,
|
|
547
547
|
args: [{ selector: 'rolatech-console-layout', standalone: true, imports: [CommonModule], template: "<p>console-layout works!</p>\n" }]
|
|
548
548
|
}] });
|
|
@@ -559,10 +559,10 @@ class MenuUserComponent {
|
|
|
559
559
|
// this.data = this.user();
|
|
560
560
|
// });
|
|
561
561
|
}
|
|
562
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
563
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
562
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MenuUserComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
563
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: MenuUserComponent, isStandalone: true, selector: "rolatech-menu-user", inputs: { user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"min-w-[256px]\">\n @if (user()) {\n <div class=\"px-6 py-3\">\n <div class=\"flex flex-row items-center\">\n <div class=\"mr-3 w-14 h-14 rounded-full bg-orange-600\">\n @if (user().avatar) {\n <img [src]=\"user().avatar\" class=\"w-14 h-14 object-cover rounded-full\" />\n }\n </div>\n <div class=\"flex flex-col\">\n <div>\n <div class=\"text-lg font-bold\">{{ user().name }}</div>\n <div class=\"formated-string\">\n <span>@{{ user().username }}</span>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"flex\">\n <a\n [href]=\"myaccountUrl\"\n target=\"_blank\"\n class=\"text-sm my-2 p-1 px-6 ml-24 rounded border border-gray-300 hover:bg-gray-200\"\n >\u7528\u6237\u4E2D\u5FC3</a\n >\n </div> -->\n </div>\n }\n\n <div class=\"flex justify-between items-center\">\n <a mat-menu-item [href]=\"myaccountUrl\" target=\"_blank\" class=\"px-6\">\n <span class=\"flex justify-between items-center\">\n <span class=\"pl-2\"> \u7528\u6237\u4E2D\u5FC3 </span>\n <span class=\"flex\"> <mat-icon>open_in_new</mat-icon></span>\n </span>\n </a>\n </div>\n</div>\n", styles: [".formated-string{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
564
564
|
}
|
|
565
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
565
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MenuUserComponent, decorators: [{
|
|
566
566
|
type: Component,
|
|
567
567
|
args: [{ standalone: true, imports: [MatMenuModule, MatIconModule], selector: 'rolatech-menu-user', template: "<div class=\"min-w-[256px]\">\n @if (user()) {\n <div class=\"px-6 py-3\">\n <div class=\"flex flex-row items-center\">\n <div class=\"mr-3 w-14 h-14 rounded-full bg-orange-600\">\n @if (user().avatar) {\n <img [src]=\"user().avatar\" class=\"w-14 h-14 object-cover rounded-full\" />\n }\n </div>\n <div class=\"flex flex-col\">\n <div>\n <div class=\"text-lg font-bold\">{{ user().name }}</div>\n <div class=\"formated-string\">\n <span>@{{ user().username }}</span>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"flex\">\n <a\n [href]=\"myaccountUrl\"\n target=\"_blank\"\n class=\"text-sm my-2 p-1 px-6 ml-24 rounded border border-gray-300 hover:bg-gray-200\"\n >\u7528\u6237\u4E2D\u5FC3</a\n >\n </div> -->\n </div>\n }\n\n <div class=\"flex justify-between items-center\">\n <a mat-menu-item [href]=\"myaccountUrl\" target=\"_blank\" class=\"px-6\">\n <span class=\"flex justify-between items-center\">\n <span class=\"pl-2\"> \u7528\u6237\u4E2D\u5FC3 </span>\n <span class=\"flex\"> <mat-icon>open_in_new</mat-icon></span>\n </span>\n </a>\n </div>\n</div>\n", styles: [".formated-string{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}\n"] }]
|
|
568
568
|
}], ctorParameters: () => [] });
|
|
@@ -572,10 +572,10 @@ class TopbarAvatarMenuComponent {
|
|
|
572
572
|
platformId = inject(PLATFORM_ID);
|
|
573
573
|
menu = input.required();
|
|
574
574
|
user = input();
|
|
575
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
576
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
575
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TopbarAvatarMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
576
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: TopbarAvatarMenuComponent, isStandalone: true, selector: "rolatech-topbar-avatar-menu", inputs: { menu: { classPropertyName: "menu", publicName: "menu", isSignal: true, isRequired: true, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (user()) {\n <div class=\"flex\">\n <a\n class=\"flex justify-center items-center rounded-full overflow-hidden cursor-pointer hover:outline-gray-200 outline outline-transparent outline-4\"\n [matMenuTriggerFor]=\"menu()\"\n >\n <div class=\"bg-orange-600 w-9 h-9\">\n @if (user().avatar) {\n <img class=\"w-9 h-9 object-cover\" [src]=\"user().avatar\" />\n }\n </div>\n </a>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
|
|
577
577
|
}
|
|
578
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
578
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TopbarAvatarMenuComponent, decorators: [{
|
|
579
579
|
type: Component,
|
|
580
580
|
args: [{ selector: 'rolatech-topbar-avatar-menu', standalone: true, imports: [
|
|
581
581
|
CommonModule,
|
|
@@ -590,10 +590,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
|
|
|
590
590
|
}] });
|
|
591
591
|
|
|
592
592
|
class FolderComponent {
|
|
593
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
594
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
593
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: FolderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
594
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: FolderComponent, isStandalone: true, selector: "rolatech-folder", ngImport: i0, template: "<div></div>\n", styles: [""] });
|
|
595
595
|
}
|
|
596
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
596
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: FolderComponent, decorators: [{
|
|
597
597
|
type: Component,
|
|
598
598
|
args: [{ selector: 'rolatech-folder', standalone: true, template: "<div></div>\n" }]
|
|
599
599
|
}] });
|
|
@@ -628,10 +628,10 @@ class MediaPreviewDialogComponent {
|
|
|
628
628
|
this.prevDisabled = this.selected === 0;
|
|
629
629
|
this.nextDisabled = this.selected === this.data.media.length - 1;
|
|
630
630
|
}
|
|
631
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
632
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
631
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaPreviewDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
632
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: MediaPreviewDialogComponent, isStandalone: true, selector: "rolatech-media-preview-dialog", ngImport: i0, template: "<div class=\"flex flex-col h-full overflow-hidden\">\n <div class=\"h-16 flex justify-between items-center px-5\">\n @if (data.title) {\n <div class=\"text-md font-medium\">{{ data.title }}</div>\n }\n <div class=\"cursor-pointer\" (click)=\"close()\">\n <mat-icon fontIcon=\"close\"></mat-icon>\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"flex-1 overflow-hidden overflow-y-auto\">\n <div class=\"p-3 flex justify-center items-center\">\n <img class=\"object-cover\" [src]=\"data.media[selected].url\" />\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"h-16 flex justify-between items-center px-5\">\n <button mat-flat-button [disabled]=\"prevDisabled\" (click)=\"prev()\">Prev</button>\n <div>{{ selected + 1 }} / {{ data.media.length }}</div>\n <button mat-flat-button [disabled]=\"nextDisabled\" (click)=\"next()\">Next</button>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] });
|
|
633
633
|
}
|
|
634
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
634
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaPreviewDialogComponent, decorators: [{
|
|
635
635
|
type: Component,
|
|
636
636
|
args: [{ selector: 'rolatech-media-preview-dialog', standalone: true, imports: [MatIconModule, MatDividerModule, MatButtonModule], template: "<div class=\"flex flex-col h-full overflow-hidden\">\n <div class=\"h-16 flex justify-between items-center px-5\">\n @if (data.title) {\n <div class=\"text-md font-medium\">{{ data.title }}</div>\n }\n <div class=\"cursor-pointer\" (click)=\"close()\">\n <mat-icon fontIcon=\"close\"></mat-icon>\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"flex-1 overflow-hidden overflow-y-auto\">\n <div class=\"p-3 flex justify-center items-center\">\n <img class=\"object-cover\" [src]=\"data.media[selected].url\" />\n </div>\n </div>\n <mat-divider></mat-divider>\n <div class=\"h-16 flex justify-between items-center px-5\">\n <button mat-flat-button [disabled]=\"prevDisabled\" (click)=\"prev()\">Prev</button>\n <div>{{ selected + 1 }} / {{ data.media.length }}</div>\n <button mat-flat-button [disabled]=\"nextDisabled\" (click)=\"next()\">Next</button>\n </div>\n</div>\n" }]
|
|
637
637
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
@@ -687,8 +687,8 @@ const MAT_MODULE = [
|
|
|
687
687
|
ScrollingModule,
|
|
688
688
|
];
|
|
689
689
|
class MaterialModule {
|
|
690
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
691
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
690
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
691
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.3", ngImport: i0, type: MaterialModule, imports: [A11yModule,
|
|
692
692
|
ClipboardModule,
|
|
693
693
|
CdkStepperModule,
|
|
694
694
|
CdkTableModule,
|
|
@@ -777,7 +777,7 @@ class MaterialModule {
|
|
|
777
777
|
MatTreeModule,
|
|
778
778
|
PortalModule,
|
|
779
779
|
ScrollingModule] });
|
|
780
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
780
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MaterialModule, imports: [MAT_MODULE, A11yModule,
|
|
781
781
|
ClipboardModule,
|
|
782
782
|
CdkStepperModule,
|
|
783
783
|
CdkTableModule,
|
|
@@ -823,7 +823,7 @@ class MaterialModule {
|
|
|
823
823
|
PortalModule,
|
|
824
824
|
ScrollingModule] });
|
|
825
825
|
}
|
|
826
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
826
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MaterialModule, decorators: [{
|
|
827
827
|
type: NgModule,
|
|
828
828
|
args: [{
|
|
829
829
|
imports: [...MAT_MODULE],
|
|
@@ -832,11 +832,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
|
|
|
832
832
|
}] });
|
|
833
833
|
|
|
834
834
|
class AngularComponentsModule {
|
|
835
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
836
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
837
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
835
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AngularComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
836
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.3", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule], exports: [MaterialModule] });
|
|
837
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AngularComponentsModule, imports: [MaterialModule, MaterialModule] });
|
|
838
838
|
}
|
|
839
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
839
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AngularComponentsModule, decorators: [{
|
|
840
840
|
type: NgModule,
|
|
841
841
|
args: [{
|
|
842
842
|
imports: [MaterialModule],
|
|
@@ -863,10 +863,10 @@ class SpinnerComponent {
|
|
|
863
863
|
if (this.loadingSubscription)
|
|
864
864
|
this.loadingSubscription.unsubscribe();
|
|
865
865
|
}
|
|
866
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
867
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.
|
|
866
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
867
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.3", type: SpinnerComponent, isStandalone: true, selector: "rolatech-spinner", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex justify-center\">\n <div class=\"lds-spinner\">\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n </div>\n</div>\n", styles: [".lds-spinner{color:official;display:inline-block;position:relative;width:40px;height:40px}.lds-spinner div{transform-origin:20px 20px;animation:lds-spinner 1.2s linear infinite}.lds-spinner div:after{content:\" \";display:block;position:absolute;top:4px;left:18px;width:4px;height:8px;border-radius:20%;background:#333}.lds-spinner div:nth-child(1){transform:rotate(0);animation-delay:-1.1s}.lds-spinner div:nth-child(2){transform:rotate(30deg);animation-delay:-1s}.lds-spinner div:nth-child(3){transform:rotate(60deg);animation-delay:-.9s}.lds-spinner div:nth-child(4){transform:rotate(90deg);animation-delay:-.8s}.lds-spinner div:nth-child(5){transform:rotate(120deg);animation-delay:-.7s}.lds-spinner div:nth-child(6){transform:rotate(150deg);animation-delay:-.6s}.lds-spinner div:nth-child(7){transform:rotate(180deg);animation-delay:-.5s}.lds-spinner div:nth-child(8){transform:rotate(210deg);animation-delay:-.4s}.lds-spinner div:nth-child(9){transform:rotate(240deg);animation-delay:-.3s}.lds-spinner div:nth-child(10){transform:rotate(270deg);animation-delay:-.2s}.lds-spinner div:nth-child(11){transform:rotate(300deg);animation-delay:-.1s}.lds-spinner div:nth-child(12){transform:rotate(330deg);animation-delay:0s}@keyframes lds-spinner{0%{opacity:1}to{opacity:0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
868
868
|
}
|
|
869
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
869
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: SpinnerComponent, decorators: [{
|
|
870
870
|
type: Component,
|
|
871
871
|
args: [{ selector: 'rolatech-spinner', standalone: true, imports: [CommonModule], template: "<div class=\"flex justify-center\">\n <div class=\"lds-spinner\">\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n </div>\n</div>\n", styles: [".lds-spinner{color:official;display:inline-block;position:relative;width:40px;height:40px}.lds-spinner div{transform-origin:20px 20px;animation:lds-spinner 1.2s linear infinite}.lds-spinner div:after{content:\" \";display:block;position:absolute;top:4px;left:18px;width:4px;height:8px;border-radius:20%;background:#333}.lds-spinner div:nth-child(1){transform:rotate(0);animation-delay:-1.1s}.lds-spinner div:nth-child(2){transform:rotate(30deg);animation-delay:-1s}.lds-spinner div:nth-child(3){transform:rotate(60deg);animation-delay:-.9s}.lds-spinner div:nth-child(4){transform:rotate(90deg);animation-delay:-.8s}.lds-spinner div:nth-child(5){transform:rotate(120deg);animation-delay:-.7s}.lds-spinner div:nth-child(6){transform:rotate(150deg);animation-delay:-.6s}.lds-spinner div:nth-child(7){transform:rotate(180deg);animation-delay:-.5s}.lds-spinner div:nth-child(8){transform:rotate(210deg);animation-delay:-.4s}.lds-spinner div:nth-child(9){transform:rotate(240deg);animation-delay:-.3s}.lds-spinner div:nth-child(10){transform:rotate(270deg);animation-delay:-.2s}.lds-spinner div:nth-child(11){transform:rotate(300deg);animation-delay:-.1s}.lds-spinner div:nth-child(12){transform:rotate(330deg);animation-delay:0s}@keyframes lds-spinner{0%{opacity:1}to{opacity:0}}\n"] }]
|
|
872
872
|
}] });
|
|
@@ -913,10 +913,10 @@ class MediaUploadComponent {
|
|
|
913
913
|
};
|
|
914
914
|
}
|
|
915
915
|
}
|
|
916
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
917
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
916
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
917
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: MediaUploadComponent, isStandalone: true, selector: "rolatech-media-upload", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, isUploading: { classPropertyName: "isUploading", publicName: "isUploading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mediaItemClick: "mediaItemClick", upload: "upload" }, ngImport: i0, template: "<div class=\"bg-gray-100 rounded p-6 min-h-[320px] flex items-center justify-center\">\n @if (isUploading()) {\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"p-3\">\n <mat-icon>upload</mat-icon>\n </div>\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"font-lg font-bold py-3\">{{ title() }}</div>\n <div class=\"font-sm text-gray-400\">{{ subtitle() }}</div>\n <div class=\"font-sm text-gray-400\">{{ description() }}</div>\n </div>\n <div class=\"py-2\">\n <input style=\"display: none\" type=\"file\" (change)=\"onUpload($event)\" #fileInput />\n <button mat-flat-button color=\"primary\" (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n </div>\n } @else {\n <rolatech-spinner title=\"\u4E0A\u4F20\u4E2D\"></rolatech-spinner>\n }\n</div>\n<div class=\"flex flex-row\">\n @for (media of media; track $index) {\n <div (click)=\"onMediaClick($index)\" class=\"inline-flex flex-row mt-3 mr-3 cursor-pointer rounded-md\">\n <img class=\"rounded-md aspect-video object-cover w-32\" [src]=\"media.url\" />\n </div>\n }\n</div>\n", styles: [".mat-icon{transform:scale(2)}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }] });
|
|
918
918
|
}
|
|
919
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
919
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaUploadComponent, decorators: [{
|
|
920
920
|
type: Component,
|
|
921
921
|
args: [{ standalone: true, imports: [AngularCommonModule, AngularComponentsModule, SpinnerComponent], selector: 'rolatech-media-upload', template: "<div class=\"bg-gray-100 rounded p-6 min-h-[320px] flex items-center justify-center\">\n @if (isUploading()) {\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"p-3\">\n <mat-icon>upload</mat-icon>\n </div>\n <div class=\"flex flex-col items-center justify-center\">\n <div class=\"font-lg font-bold py-3\">{{ title() }}</div>\n <div class=\"font-sm text-gray-400\">{{ subtitle() }}</div>\n <div class=\"font-sm text-gray-400\">{{ description() }}</div>\n </div>\n <div class=\"py-2\">\n <input style=\"display: none\" type=\"file\" (change)=\"onUpload($event)\" #fileInput />\n <button mat-flat-button color=\"primary\" (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n </div>\n } @else {\n <rolatech-spinner title=\"\u4E0A\u4F20\u4E2D\"></rolatech-spinner>\n }\n</div>\n<div class=\"flex flex-row\">\n @for (media of media; track $index) {\n <div (click)=\"onMediaClick($index)\" class=\"inline-flex flex-row mt-3 mr-3 cursor-pointer rounded-md\">\n <img class=\"rounded-md aspect-video object-cover w-32\" [src]=\"media.url\" />\n </div>\n }\n</div>\n", styles: [".mat-icon{transform:scale(2)}\n"] }]
|
|
922
922
|
}] });
|
|
@@ -928,10 +928,10 @@ class StorageBucketCreateComponent {
|
|
|
928
928
|
ngDoCheck() {
|
|
929
929
|
this.output.emit(this.name());
|
|
930
930
|
}
|
|
931
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
932
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.
|
|
931
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: StorageBucketCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
932
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.3", type: StorageBucketCreateComponent, isStandalone: true, selector: "rolatech-storage-bucket-create", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
933
933
|
}
|
|
934
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
934
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: StorageBucketCreateComponent, decorators: [{
|
|
935
935
|
type: Component,
|
|
936
936
|
args: [{ selector: 'rolatech-storage-bucket-create', standalone: true, imports: [MatFormFieldModule, MatInputModule, FormsModule], template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
937
937
|
}] });
|
|
@@ -959,10 +959,10 @@ class StorageFileUploadComponent {
|
|
|
959
959
|
removeFile() {
|
|
960
960
|
this.file = null;
|
|
961
961
|
}
|
|
962
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
963
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
962
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: StorageFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
963
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: StorageFileUploadComponent, isStandalone: true, selector: "rolatech-storage-file-upload", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u6807\u9898</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u6807\u9898\" [(ngModel)]=\"title\" />\n </mat-form-field>\n\n <div class=\"mt-2\">\n <input #fileInput class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-raised-button (click)=\"fileInput.click()\">\u9009\u62E9\u6587\u4EF6</button>\n </div>\n @if (file) {\n <div class=\"p-2 flex justify-between items-center\">\n <div>{{ file.name }}</div>\n <button matSuffix mat-icon-button (click)=\"removeFile()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n }\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
964
964
|
}
|
|
965
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
965
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: StorageFileUploadComponent, decorators: [{
|
|
966
966
|
type: Component,
|
|
967
967
|
args: [{ selector: 'rolatech-storage-file-upload', standalone: true, imports: [MatFormFieldModule, MatInputModule, FormsModule, MatButtonModule, MatIconModule], template: "<div>\n <mat-form-field>\n <mat-label>\u6807\u9898</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u6807\u9898\" [(ngModel)]=\"title\" />\n </mat-form-field>\n\n <div class=\"mt-2\">\n <input #fileInput class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-raised-button (click)=\"fileInput.click()\">\u9009\u62E9\u6587\u4EF6</button>\n </div>\n @if (file) {\n <div class=\"p-2 flex justify-between items-center\">\n <div>{{ file.name }}</div>\n <button matSuffix mat-icon-button (click)=\"removeFile()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n }\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
968
968
|
}] });
|
|
@@ -975,10 +975,10 @@ class StorageFolderCreateComponent {
|
|
|
975
975
|
ngDoCheck() {
|
|
976
976
|
this.output.emit({ name: this.name(), isPublic: this.isPublic() });
|
|
977
977
|
}
|
|
978
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
979
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.
|
|
978
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: StorageFolderCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
979
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.3", type: StorageFolderCreateComponent, isStandalone: true, selector: "rolatech-storage-folder-create", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, isPublic: { classPropertyName: "isPublic", publicName: "isPublic", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output" }, ngImport: i0, template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n <div class=\"flex flex-col\">\n <mat-checkbox class=\"example-margin\" [(ngModel)]=\"isPublic\">\u516C\u5F00\u8D44\u6E90</mat-checkbox>\n <span class=\"text-sm text-gray-500 ml-2 mt-1\">\u6587\u4EF6\u5939\u4E3A\u56FE\u7247\u5185\u5BB9\u65F6, \u8BF7\u53D6\u6D88\u52FE\u9009\u6B64\u9879</span>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }] });
|
|
980
980
|
}
|
|
981
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
981
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: StorageFolderCreateComponent, decorators: [{
|
|
982
982
|
type: Component,
|
|
983
983
|
args: [{ selector: 'rolatech-storage-folder-create', standalone: true, imports: [MatFormFieldModule, MatInputModule, FormsModule, MatCheckboxModule], template: "<div>\n <mat-form-field>\n <mat-label>\u540D\u79F0</mat-label>\n <input matInput placeholder=\"\u8F93\u5165\u540D\u79F0\" [(ngModel)]=\"name\" />\n </mat-form-field>\n <div class=\"flex flex-col\">\n <mat-checkbox class=\"example-margin\" [(ngModel)]=\"isPublic\">\u516C\u5F00\u8D44\u6E90</mat-checkbox>\n <span class=\"text-sm text-gray-500 ml-2 mt-1\">\u6587\u4EF6\u5939\u4E3A\u56FE\u7247\u5185\u5BB9\u65F6, \u8BF7\u53D6\u6D88\u52FE\u9009\u6B64\u9879</span>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
|
|
984
984
|
}] });
|
|
@@ -1004,10 +1004,10 @@ class WechatConnectDialogComponent {
|
|
|
1004
1004
|
this.dialogRef.close();
|
|
1005
1005
|
}
|
|
1006
1006
|
}
|
|
1007
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1008
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
1007
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: WechatConnectDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1008
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: WechatConnectDialogComponent, isStandalone: true, selector: "rolatech-wechat-connect-dialog", host: { listeners: { "window:message": "onLogin($event)" } }, ngImport: i0, template: "<div class=\"flex flex-col p-3\">\n <div class=\"text-xl font-bold\">\u626B\u7801\u7ED1\u5B9A\u5FAE\u4FE1\uFF0C\u63D0\u5347\u8D26\u53F7\u5B89\u5168\u548C\u4F7F\u7528\u4FBF\u5229\u6027</div>\n <div class=\"w-[190px] h-[190px]\">\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n <div></div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0}.normalPanel .panelContent{width:188px;height:188px}.normalPanel .wrp_code{position:relative;width:188px;height:188px;margin:0}.impowerBox .title,.normalPanel .info{display:none}.impowerBox .qrcode{margin-top:0;border:0;width:188px;height:188px}#MAXIM{content:\"veg20170418191511\"}mat-mdc-dialog-content mdc-dialog__content{padding:0}\n"] });
|
|
1009
1009
|
}
|
|
1010
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1010
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: WechatConnectDialogComponent, decorators: [{
|
|
1011
1011
|
type: Component,
|
|
1012
1012
|
args: [{ selector: 'rolatech-wechat-connect-dialog', standalone: true, template: "<div class=\"flex flex-col p-3\">\n <div class=\"text-xl font-bold\">\u626B\u7801\u7ED1\u5B9A\u5FAE\u4FE1\uFF0C\u63D0\u5347\u8D26\u53F7\u5B89\u5168\u548C\u4F7F\u7528\u4FBF\u5229\u6027</div>\n <div class=\"w-[190px] h-[190px]\">\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n <div></div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0}.normalPanel .panelContent{width:188px;height:188px}.normalPanel .wrp_code{position:relative;width:188px;height:188px;margin:0}.impowerBox .title,.normalPanel .info{display:none}.impowerBox .qrcode{margin-top:0;border:0;width:188px;height:188px}#MAXIM{content:\"veg20170418191511\"}mat-mdc-dialog-content mdc-dialog__content{padding:0}\n"] }]
|
|
1013
1013
|
}], ctorParameters: () => [], propDecorators: { onLogin: [{
|
|
@@ -1084,10 +1084,10 @@ class MediaUploadDialogComponent {
|
|
|
1084
1084
|
},
|
|
1085
1085
|
});
|
|
1086
1086
|
}
|
|
1087
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1088
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
1087
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaUploadDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i2$3.MediaService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1088
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: MediaUploadDialogComponent, isStandalone: true, selector: "rolatech-media-upload-dialog", ngImport: i0, template: "<mat-dialog-content>\n <div class=\"border-dashed border-2 border-gray-400 py-12 flex flex-col justify-center items-center\">\n <input #fileInput multiple class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-button (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n <div class=\"mt-4\">\n <h2 class=\"\">\u9884\u89C8</h2>\n <div>\n <ul id=\"gallery\" class=\"flex flex-1 flex-wrap -m-1\">\n @for (item of preMedia; track item.url; let i = $index) {\n <li class=\"block p-1 w-1/2 sm:w-1/3 md:w-1/4 lg:w-1/6 xl:w-1/8 h-24\">\n <article\n tabindex=\"0\"\n [ngClass]=\"item.isUploading ? 'isUploading' : ''\"\n class=\"group hasImage w-full h-full rounded-md focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer relative text-transparent hover:text-white shadow-sm\"\n >\n <img [src]=\"item.url\" class=\"img-preview w-full h-full sticky object-cover rounded-md bg-fixed\" />\n <section class=\"flex flex-col rounded-md text-xs break-words w-full h-full z-20 absolute top-0 py-2 px-3\">\n @if (item.isUploading) {\n <div class=\"flex justify-center items-center w-full h-full\">\n <mat-spinner color=\"white\" diameter=\"28\"></mat-spinner>\n </div>\n } @else {\n <div class=\"flex\">\n <button (click)=\"removeImage(i)\" class=\"delete ml-auto focus:outline-none hover:bg-gray-300 p-1 rounded-md\">\n <svg\n class=\"pointer-events-none fill-current w-4 h-4 ml-auto\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n >\n <path\n class=\"pointer-events-none\"\n d=\"M3 6l3 18h12l3-18h-18zm19-4v2h-20v-2h5.711c.9 0 1.631-1.099 1.631-2h5.316c0 .901.73 2 1.631 2h5.711z\"\n />\n </svg>\n </button>\n </div>\n }\n </section>\n </article>\n </li>\n }\n </ul>\n </div>\n @if (preMedia.length <= 0) {\n <div class=\"flex flex-1 flex-wrap\">\n <div class=\"h-full w-full text-center flex flex-col justify-center items-center py-6\">\n <span class=\"text-small text-gray-500\">No files selected</span>\n </div>\n </div>\n }\n </div>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n @if (preMedia.length <= 0) {\n <button mat-button>\u7B49\u5F85\u9009\u62E9</button>\n }\n @if (!isFinished && preMedia.length > 0) {\n <button mat-button (click)=\"uploadFiles()\">\u7ACB\u523B\u4E0A\u4F20</button>\n }\n @if (isFinished) {\n <button mat-button [mat-dialog-close]=\"media\">\u5B8C\u6210</button>\n }\n</mat-dialog-actions>\n", styles: [".hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}.isUploading section{background-color:#05050566}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
|
|
1089
1089
|
}
|
|
1090
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1090
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaUploadDialogComponent, decorators: [{
|
|
1091
1091
|
type: Component,
|
|
1092
1092
|
args: [{ selector: 'rolatech-media-upload-dialog', standalone: true, imports: [MatDialogContent, MatButtonModule, NgClass, MatProgressSpinnerModule, MatDialogActions, MatDialogClose], template: "<mat-dialog-content>\n <div class=\"border-dashed border-2 border-gray-400 py-12 flex flex-col justify-center items-center\">\n <input #fileInput multiple class=\"hidden\" type=\"file\" (change)=\"selectFiles($event)\" />\n <button mat-button (click)=\"fileInput.click()\">\u4E0A\u4F20\u56FE\u7247</button>\n </div>\n <div class=\"mt-4\">\n <h2 class=\"\">\u9884\u89C8</h2>\n <div>\n <ul id=\"gallery\" class=\"flex flex-1 flex-wrap -m-1\">\n @for (item of preMedia; track item.url; let i = $index) {\n <li class=\"block p-1 w-1/2 sm:w-1/3 md:w-1/4 lg:w-1/6 xl:w-1/8 h-24\">\n <article\n tabindex=\"0\"\n [ngClass]=\"item.isUploading ? 'isUploading' : ''\"\n class=\"group hasImage w-full h-full rounded-md focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer relative text-transparent hover:text-white shadow-sm\"\n >\n <img [src]=\"item.url\" class=\"img-preview w-full h-full sticky object-cover rounded-md bg-fixed\" />\n <section class=\"flex flex-col rounded-md text-xs break-words w-full h-full z-20 absolute top-0 py-2 px-3\">\n @if (item.isUploading) {\n <div class=\"flex justify-center items-center w-full h-full\">\n <mat-spinner color=\"white\" diameter=\"28\"></mat-spinner>\n </div>\n } @else {\n <div class=\"flex\">\n <button (click)=\"removeImage(i)\" class=\"delete ml-auto focus:outline-none hover:bg-gray-300 p-1 rounded-md\">\n <svg\n class=\"pointer-events-none fill-current w-4 h-4 ml-auto\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n >\n <path\n class=\"pointer-events-none\"\n d=\"M3 6l3 18h12l3-18h-18zm19-4v2h-20v-2h5.711c.9 0 1.631-1.099 1.631-2h5.316c0 .901.73 2 1.631 2h5.711z\"\n />\n </svg>\n </button>\n </div>\n }\n </section>\n </article>\n </li>\n }\n </ul>\n </div>\n @if (preMedia.length <= 0) {\n <div class=\"flex flex-1 flex-wrap\">\n <div class=\"h-full w-full text-center flex flex-col justify-center items-center py-6\">\n <span class=\"text-small text-gray-500\">No files selected</span>\n </div>\n </div>\n }\n </div>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n @if (preMedia.length <= 0) {\n <button mat-button>\u7B49\u5F85\u9009\u62E9</button>\n }\n @if (!isFinished && preMedia.length > 0) {\n <button mat-button (click)=\"uploadFiles()\">\u7ACB\u523B\u4E0A\u4F20</button>\n }\n @if (isFinished) {\n <button mat-button [mat-dialog-close]=\"media\">\u5B8C\u6210</button>\n }\n</mat-dialog-actions>\n", styles: [".hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}.isUploading section{background-color:#05050566}\n"] }]
|
|
1093
1093
|
}], ctorParameters: () => [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
|
|
@@ -1098,10 +1098,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
|
|
|
1098
1098
|
class SpacerComponent {
|
|
1099
1099
|
constructor() { }
|
|
1100
1100
|
ngOnInit() { }
|
|
1101
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1102
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
1101
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: SpacerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1102
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: SpacerComponent, isStandalone: true, selector: "rolatech-spacer", ngImport: i0, template: "<span class=\"app-spacer\"></span>\n", styles: [":host{flex:1 1 auto}.app-spacer{flex:1 1 auto}\n"] });
|
|
1103
1103
|
}
|
|
1104
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1104
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: SpacerComponent, decorators: [{
|
|
1105
1105
|
type: Component,
|
|
1106
1106
|
args: [{ selector: 'rolatech-spacer', standalone: true, template: "<span class=\"app-spacer\"></span>\n", styles: [":host{flex:1 1 auto}.app-spacer{flex:1 1 auto}\n"] }]
|
|
1107
1107
|
}], ctorParameters: () => [] });
|
|
@@ -1118,10 +1118,10 @@ class MediaListComponent {
|
|
|
1118
1118
|
onUpload(event) {
|
|
1119
1119
|
this.upload.emit(event);
|
|
1120
1120
|
}
|
|
1121
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1122
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
1121
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1122
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: MediaListComponent, isStandalone: true, selector: "rolatech-media-list", inputs: { isUploading: { classPropertyName: "isUploading", publicName: "isUploading", isSignal: true, isRequired: false, transformFunction: null }, media: { classPropertyName: "media", publicName: "media", isSignal: true, isRequired: false, transformFunction: null }, showAdd: { classPropertyName: "showAdd", publicName: "showAdd", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mediaItemClick: "mediaItemClick", upload: "upload" }, ngImport: i0, template: "<div class=\"flex flex-row flex-wrap box-border items-center\">\n <div class=\"progress-bar\">\n @if (isUploading()) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n <div class=\"flex flex-row flex-wrap box-border items-center gap-2\">\n <ng-content></ng-content>\n <div>\n <input style=\"display: none\" type=\"file\" accept=\"image/*, video/*\" (change)=\"onUpload($event)\" #fileInput />\n @if (showAdd()) {\n <div class=\"add-button\">\n <img (click)=\"fileInput.click()\" class=\"tile-media\" src=\"assets/images/baseline_add_black_48dp.png\" alt=\"add image\" />\n </div>\n }\n </div>\n </div>\n</div>\n", styles: [".progress-bar{display:block;min-height:6px;width:100%;padding:4px 0}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:80px;width:80px;object-fit:contain;cursor:pointer;padding:6px;position:relative;box-sizing:border-box}app-media-list-item:before{border-radius:12px}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }] });
|
|
1123
1123
|
}
|
|
1124
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaListComponent, decorators: [{
|
|
1125
1125
|
type: Component,
|
|
1126
1126
|
args: [{ selector: 'rolatech-media-list', standalone: true, imports: [MatProgressBarModule], template: "<div class=\"flex flex-row flex-wrap box-border items-center\">\n <div class=\"progress-bar\">\n @if (isUploading()) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n <div class=\"flex flex-row flex-wrap box-border items-center gap-2\">\n <ng-content></ng-content>\n <div>\n <input style=\"display: none\" type=\"file\" accept=\"image/*, video/*\" (change)=\"onUpload($event)\" #fileInput />\n @if (showAdd()) {\n <div class=\"add-button\">\n <img (click)=\"fileInput.click()\" class=\"tile-media\" src=\"assets/images/baseline_add_black_48dp.png\" alt=\"add image\" />\n </div>\n }\n </div>\n </div>\n</div>\n", styles: [".progress-bar{display:block;min-height:6px;width:100%;padding:4px 0}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:80px;width:80px;object-fit:contain;cursor:pointer;padding:6px;position:relative;box-sizing:border-box}app-media-list-item:before{border-radius:12px}\n"] }]
|
|
1127
1127
|
}] });
|
|
@@ -1137,10 +1137,10 @@ class MediaListItemComponent {
|
|
|
1137
1137
|
onDeleteMedia(media) {
|
|
1138
1138
|
this.deleteMedia.emit(media);
|
|
1139
1139
|
}
|
|
1140
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1141
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.
|
|
1140
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1141
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.3", type: MediaListItemComponent, isStandalone: true, selector: "rolatech-media-list-item", inputs: { media: { classPropertyName: "media", publicName: "media", isSignal: true, isRequired: true, transformFunction: null }, uploadProgress: { classPropertyName: "uploadProgress", publicName: "uploadProgress", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mediaItemClick: "mediaItemClick", deleteMedia: "deleteMedia" }, ngImport: i0, template: "<div\n class=\"media-list-item relative hasImage focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer text-transparent hover:text-white shadow-sm\"\n>\n <div class=\"absolute z-30 right-0\">\n <div class=\"flex-1\"></div>\n <div>\n <button mat-icon-button [matMenuTriggerFor]=\"beforeMenu\" class=\"ml-auto focus:outline-none hover:bg-gray-300 p-1\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(media())\">\n <span>\u5220\u9664</span>\n </button>\n </mat-menu>\n </div>\n </div>\n <div id=\"thumbnail\" class=\"thumbnail\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media().url\" [alt]=\"media().alt\" />\n </div>\n <section\n (click)=\"onMediaItemClick(media())\"\n class=\"flex flex-col text-xs break-words w-full h-full z-20 absolute top-0\"\n ></section>\n</div>\n", styles: [".media-list-item{cursor:pointer;box-sizing:border-box;height:128px;width:228px;display:inline-block;display:block;position:relative;flex:none}.tile-media{height:100%;width:100%;object-fit:cover;display:inline-block;background-color:transparent}#thumbnail.thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block;position:absolute;border-radius:8px;inset:0}.hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
1142
1142
|
}
|
|
1143
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1143
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaListItemComponent, decorators: [{
|
|
1144
1144
|
type: Component,
|
|
1145
1145
|
args: [{ selector: 'rolatech-media-list-item', standalone: true, imports: [MatButtonModule, MatMenuModule, MatIconModule], template: "<div\n class=\"media-list-item relative hasImage focus:outline-none focus:shadow-outline bg-gray-100 cursor-pointer text-transparent hover:text-white shadow-sm\"\n>\n <div class=\"absolute z-30 right-0\">\n <div class=\"flex-1\"></div>\n <div>\n <button mat-icon-button [matMenuTriggerFor]=\"beforeMenu\" class=\"ml-auto focus:outline-none hover:bg-gray-300 p-1\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(media())\">\n <span>\u5220\u9664</span>\n </button>\n </mat-menu>\n </div>\n </div>\n <div id=\"thumbnail\" class=\"thumbnail\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media().url\" [alt]=\"media().alt\" />\n </div>\n <section\n (click)=\"onMediaItemClick(media())\"\n class=\"flex flex-col text-xs break-words w-full h-full z-20 absolute top-0\"\n ></section>\n</div>\n", styles: [".media-list-item{cursor:pointer;box-sizing:border-box;height:128px;width:228px;display:inline-block;display:block;position:relative;flex:none}.tile-media{height:100%;width:100%;object-fit:cover;display:inline-block;background-color:transparent}#thumbnail.thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block;position:absolute;border-radius:8px;inset:0}.hasImage:hover section{background-color:#05050566}.hasImage:hover button:hover{background:#05050573}\n"] }]
|
|
1146
1146
|
}] });
|
|
@@ -1163,10 +1163,10 @@ class NotFoundComponent {
|
|
|
1163
1163
|
}
|
|
1164
1164
|
});
|
|
1165
1165
|
}
|
|
1166
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1167
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
1166
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: NotFoundComponent, deps: [{ token: i1$4.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
1167
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: NotFoundComponent, isStandalone: true, selector: "rolatech-not-found", ngImport: i0, template: "<div class=\"not-found-content\">\n <p>\n <b>404.</b>\n <ins>That\u2019s an error.</ins>\n </p>\n <p>\n The requested URL <code>{{ url }}</code> not found on this server.\n </p>\n <a href=\"/\">return home</a>\n</div>\n", styles: [":host{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}.not-found-content{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}\n"] });
|
|
1168
1168
|
}
|
|
1169
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1169
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: NotFoundComponent, decorators: [{
|
|
1170
1170
|
type: Component,
|
|
1171
1171
|
args: [{ selector: 'rolatech-not-found', standalone: true, template: "<div class=\"not-found-content\">\n <p>\n <b>404.</b>\n <ins>That\u2019s an error.</ins>\n </p>\n <p>\n The requested URL <code>{{ url }}</code> not found on this server.\n </p>\n <a href=\"/\">return home</a>\n</div>\n", styles: [":host{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}.not-found-content{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}\n"] }]
|
|
1172
1172
|
}], ctorParameters: () => [{ type: i1$4.Router }] });
|
|
@@ -1177,10 +1177,10 @@ class ConfirmationDialogComponent {
|
|
|
1177
1177
|
onNoClick() {
|
|
1178
1178
|
this.dialogRef.close();
|
|
1179
1179
|
}
|
|
1180
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1181
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
1180
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ConfirmationDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1181
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: ConfirmationDialogComponent, isStandalone: true, selector: "rolatech-confirmation-dialog", ngImport: i0, template: "@if (data.title) {\n <h2 mat-dialog-title>{{ data.title }}</h2>\n}\n<div mat-dialog-content>\n {{ data.message }}\n</div>\n<div mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n <button mat-button [mat-dialog-close]=\"true\" cdkFocusInitial>\u786E\u5B9A</button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
|
|
1182
1182
|
}
|
|
1183
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1183
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
|
|
1184
1184
|
type: Component,
|
|
1185
1185
|
args: [{ selector: 'rolatech-confirmation-dialog', standalone: true, imports: [MatDialogTitle, MatDialogContent, MatDialogActions, MatButtonModule, MatDialogClose], template: "@if (data.title) {\n <h2 mat-dialog-title>{{ data.title }}</h2>\n}\n<div mat-dialog-content>\n {{ data.message }}\n</div>\n<div mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close>\u53D6\u6D88</button>\n <button mat-button [mat-dialog-close]=\"true\" cdkFocusInitial>\u786E\u5B9A</button>\n</div>\n" }]
|
|
1186
1186
|
}] });
|
|
@@ -1217,10 +1217,10 @@ class TableComponent {
|
|
|
1217
1217
|
this.displayedColumns = map$1(this.dataSource().columns, 'ref');
|
|
1218
1218
|
// console.log(this.displayedColumns);
|
|
1219
1219
|
}
|
|
1220
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1221
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
1220
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1221
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: TableComponent, isStandalone: true, selector: "rolatech-table", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<table mat-table [dataSource]=\"dataSource().data\">\n @for (column of dataSource().columns; track $index) {\n <ng-container [matColumnDef]=\"column.ref\" sticky>\n <th mat-header-cell *matHeaderCellDef>{{ column.name }}</th>\n <td mat-cell *matCellDef=\"let item\">{{ item[column.ref] }}</td>\n </ng-container>\n }\n <!-- <ng-container matColumnDef=\"actions\" stickyEnd>\n <th mat-header-cell *matHeaderCellDef class=\"actions\">\u8BE6\u60C5</th>\n <td mat-cell *matCellDef=\"let item\" class=\"actions\">\n <a [routerLink]=\"['../', item.id]\"> \u8BE6\u60C5 </a>\n </td>\n </ng-container> -->\n\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n</table>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$5.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i1$5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: RouterModule }] });
|
|
1222
1222
|
}
|
|
1223
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1223
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TableComponent, decorators: [{
|
|
1224
1224
|
type: Component,
|
|
1225
1225
|
args: [{ selector: 'rolatech-table', standalone: true, imports: [CommonModule, MatTableModule, RouterModule], template: "<table mat-table [dataSource]=\"dataSource().data\">\n @for (column of dataSource().columns; track $index) {\n <ng-container [matColumnDef]=\"column.ref\" sticky>\n <th mat-header-cell *matHeaderCellDef>{{ column.name }}</th>\n <td mat-cell *matCellDef=\"let item\">{{ item[column.ref] }}</td>\n </ng-container>\n }\n <!-- <ng-container matColumnDef=\"actions\" stickyEnd>\n <th mat-header-cell *matHeaderCellDef class=\"actions\">\u8BE6\u60C5</th>\n <td mat-cell *matCellDef=\"let item\" class=\"actions\">\n <a [routerLink]=\"['../', item.id]\"> \u8BE6\u60C5 </a>\n </td>\n </ng-container> -->\n\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns\"></tr>\n</table>\n" }]
|
|
1226
1226
|
}] });
|
|
@@ -1234,19 +1234,19 @@ class PaginatorComponent {
|
|
|
1234
1234
|
onPage(event) {
|
|
1235
1235
|
this.page.emit(event);
|
|
1236
1236
|
}
|
|
1237
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1238
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
1237
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1238
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: PaginatorComponent, isStandalone: true, selector: "rolatech-paginator", outputs: { page: "page" }, ngImport: i0, template: "<mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPage($event)\"\n hidePageSize\n showFirstLastButtons\n>\n</mat-paginator>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$6.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }] });
|
|
1239
1239
|
}
|
|
1240
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1240
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
1241
1241
|
type: Component,
|
|
1242
1242
|
args: [{ selector: 'rolatech-paginator', standalone: true, imports: [CommonModule, MatPaginatorModule], template: "<mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPage($event)\"\n hidePageSize\n showFirstLastButtons\n>\n</mat-paginator>\n" }]
|
|
1243
1243
|
}] });
|
|
1244
1244
|
|
|
1245
1245
|
class MediaPreviewComponent {
|
|
1246
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1247
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
1246
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaPreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1247
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: MediaPreviewComponent, isStandalone: true, selector: "rolatech-media-preview", ngImport: i0, template: "<p>media-preview works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
1248
1248
|
}
|
|
1249
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1249
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: MediaPreviewComponent, decorators: [{
|
|
1250
1250
|
type: Component,
|
|
1251
1251
|
args: [{ selector: 'rolatech-media-preview', standalone: true, imports: [CommonModule], template: "<p>media-preview works!</p>\n" }]
|
|
1252
1252
|
}] });
|
|
@@ -1255,10 +1255,10 @@ class ToolbarComponent {
|
|
|
1255
1255
|
title = input();
|
|
1256
1256
|
subtitle = input();
|
|
1257
1257
|
back = input(false, { transform: booleanAttribute });
|
|
1258
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1259
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
1258
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1259
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: ToolbarComponent, isStandalone: true, selector: "rolatech-toolbar", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, back: { classPropertyName: "back", publicName: "back", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"px-4\">\n <div class=\"flex justify-between items-center h-14\">\n @if (back()) {\n <div class=\"-ml-2\">\n <rolatech-icon-button rolatechBackButton> arrow_back </rolatech-icon-button>\n </div>\n }\n @if (title()) {\n <span class=\"text-xl font-medium\">{{ title() }}</span>\n }\n <div class=\"flex-1\"></div>\n <div class=\"flex justify-center items-center\">\n <ng-content></ng-content>\n </div>\n </div>\n @if (subtitle()) {\n <div class=\"-mt-3\">\n <span class=\"text-sm text-gray-500\">{{ subtitle() }}</span>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconButtonComponent, selector: "rolatech-icon-button" }, { kind: "directive", type: BackButtonDirective, selector: "[rolatechBackButton]" }] });
|
|
1260
1260
|
}
|
|
1261
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1261
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
1262
1262
|
type: Component,
|
|
1263
1263
|
args: [{ selector: 'rolatech-toolbar', standalone: true, imports: [CommonModule, IconButtonComponent, BackButtonDirective], template: "<div class=\"px-4\">\n <div class=\"flex justify-between items-center h-14\">\n @if (back()) {\n <div class=\"-ml-2\">\n <rolatech-icon-button rolatechBackButton> arrow_back </rolatech-icon-button>\n </div>\n }\n @if (title()) {\n <span class=\"text-xl font-medium\">{{ title() }}</span>\n }\n <div class=\"flex-1\"></div>\n <div class=\"flex justify-center items-center\">\n <ng-content></ng-content>\n </div>\n </div>\n @if (subtitle()) {\n <div class=\"-mt-3\">\n <span class=\"text-sm text-gray-500\">{{ subtitle() }}</span>\n </div>\n }\n</div>\n" }]
|
|
1264
1264
|
}] });
|
|
@@ -1272,10 +1272,10 @@ class ImageComponent {
|
|
|
1272
1272
|
image.style.visibility = 'visible';
|
|
1273
1273
|
};
|
|
1274
1274
|
}
|
|
1275
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1276
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.
|
|
1275
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1276
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.3", type: ImageComponent, isStandalone: true, selector: "rolatech-image", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "img", first: true, predicate: ["img"], descendants: true, isSignal: true }], ngImport: i0, template: "<img #img class=\"rolatech-image bg-gray-200\" [src]=\"src()\" style=\"visibility: hidden\" loading=\"lazy\" />\n", styles: [".rolatech-image{display:inline-block;min-height:1px;min-width:1px;width:100%;height:100%;object-fit:cover}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1277
1277
|
}
|
|
1278
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1278
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ImageComponent, decorators: [{
|
|
1279
1279
|
type: Component,
|
|
1280
1280
|
args: [{ selector: 'rolatech-image', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<img #img class=\"rolatech-image bg-gray-200\" [src]=\"src()\" style=\"visibility: hidden\" loading=\"lazy\" />\n", styles: [".rolatech-image{display:inline-block;min-height:1px;min-width:1px;width:100%;height:100%;object-fit:cover}\n"] }]
|
|
1281
1281
|
}] });
|
|
@@ -1289,10 +1289,10 @@ class ThumbnailComponent {
|
|
|
1289
1289
|
sizea = effect(() => {
|
|
1290
1290
|
this.renderer.setAttribute(this.el.nativeElement, 'size', this.size());
|
|
1291
1291
|
});
|
|
1292
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1293
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.
|
|
1292
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ThumbnailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1293
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.3", type: ThumbnailComponent, isStandalone: true, selector: "rolatech-thumbnail", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.rt-rich-grid-media": "this.hasClass" } }, ngImport: i0, template: "<a id=\"thumbnail\" class=\"rt-thumbnail\">\n <rolatech-image [src]=\"src()\"> </rolatech-image>\n</a>\n<!-- <a id=\"thumbnail\" class=\"rt-thumbnail\">\n @defer (on viewport) {\n <rolatech-image [src]=\"src()\"> </rolatech-image>\n } @placeholder {\n <div class=\"bg-gray-200 w-full h-full rounded-lg\"></div>\n }\n</a> -->\n", styles: ["rolatech-thumbnail{display:block;width:100%;position:relative}rolatech-thumbnail:before{display:block;content:\"\";width:100%;padding-top:56.25%;background-color:rgb(229 231 235/var(--tw-bg-opacity))}rolatech-thumbnail #thumbnail.rt-thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block}rolatech-thumbnail #thumbnail.rt-thumbnail{position:absolute;inset:0}rolatech-thumbnail a.rt-thumbnail,rolatech-thumbnail:before{border-radius:0}rolatech-thumbnail[size][circular] a.rt-thumbnail,rolatech-thumbnail[size][circular]:before{border-radius:50%}rolatech-thumbnail[size=small] a.rt-thumbnail,rolatech-thumbnail[size=small]:before{border-radius:4px}rolatech-thumbnail[size=medium] a.rt-thumbnail,rolatech-thumbnail[size=medium]:before{border-radius:8px}rolatech-thumbnail[size=large] a.rt-thumbnail,rolatech-thumbnail[size=large]:before{border-radius:12px}rolatech-thumbnail[size][has-clip] a.rt-thumbnail,rolatech-thumbnail[size][has-clip]:before{border-radius:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ImageComponent, selector: "rolatech-image", inputs: ["src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1294
1294
|
}
|
|
1295
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1295
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ThumbnailComponent, decorators: [{
|
|
1296
1296
|
type: Component,
|
|
1297
1297
|
args: [{ selector: 'rolatech-thumbnail', standalone: true, imports: [CommonModule, ImageComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<a id=\"thumbnail\" class=\"rt-thumbnail\">\n <rolatech-image [src]=\"src()\"> </rolatech-image>\n</a>\n<!-- <a id=\"thumbnail\" class=\"rt-thumbnail\">\n @defer (on viewport) {\n <rolatech-image [src]=\"src()\"> </rolatech-image>\n } @placeholder {\n <div class=\"bg-gray-200 w-full h-full rounded-lg\"></div>\n }\n</a> -->\n", styles: ["rolatech-thumbnail{display:block;width:100%;position:relative}rolatech-thumbnail:before{display:block;content:\"\";width:100%;padding-top:56.25%;background-color:rgb(229 231 235/var(--tw-bg-opacity))}rolatech-thumbnail #thumbnail.rt-thumbnail{height:100%;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;display:block}rolatech-thumbnail #thumbnail.rt-thumbnail{position:absolute;inset:0}rolatech-thumbnail a.rt-thumbnail,rolatech-thumbnail:before{border-radius:0}rolatech-thumbnail[size][circular] a.rt-thumbnail,rolatech-thumbnail[size][circular]:before{border-radius:50%}rolatech-thumbnail[size=small] a.rt-thumbnail,rolatech-thumbnail[size=small]:before{border-radius:4px}rolatech-thumbnail[size=medium] a.rt-thumbnail,rolatech-thumbnail[size=medium]:before{border-radius:8px}rolatech-thumbnail[size=large] a.rt-thumbnail,rolatech-thumbnail[size=large]:before{border-radius:12px}rolatech-thumbnail[size][has-clip] a.rt-thumbnail,rolatech-thumbnail[size][has-clip]:before{border-radius:0}\n"] }]
|
|
1298
1298
|
}], propDecorators: { hasClass: [{
|
|
@@ -1305,12 +1305,12 @@ class TabComponent {
|
|
|
1305
1305
|
hasClass = true;
|
|
1306
1306
|
label = input.required();
|
|
1307
1307
|
item = viewChild('content');
|
|
1308
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1309
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.
|
|
1308
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1309
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.3", type: TabComponent, isStandalone: true, selector: "rolatech-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "id": "this.hasId", "class.tab": "this.hasClass" } }, viewQueries: [{ propertyName: "item", first: true, predicate: ["content"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"content\" #content>\n {{ label() }}\n</div>\n", styles: ["rolatech-tab{display:inline-flex;align-items:center;-ms-flex-pack:center;justify-content:center;flex:1 1 auto;position:relative;padding:0 12px;overflow:hidden;cursor:pointer;vertical-align:middle;font-family:Roboto,Noto,sans-serif;-webkit-font-smoothing:antialiased}rolatech-tab:hover{background-color:#f3f4f6}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1310
1310
|
}
|
|
1311
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1311
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TabComponent, decorators: [{
|
|
1312
1312
|
type: Component,
|
|
1313
|
-
args: [{ selector: 'rolatech-tab', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"content\" #content>\n {{ label() }}\n</div>\n", styles: ["rolatech-tab{
|
|
1313
|
+
args: [{ selector: 'rolatech-tab', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"content\" #content>\n {{ label() }}\n</div>\n", styles: ["rolatech-tab{display:inline-flex;align-items:center;-ms-flex-pack:center;justify-content:center;flex:1 1 auto;position:relative;padding:0 12px;overflow:hidden;cursor:pointer;vertical-align:middle;font-family:Roboto,Noto,sans-serif;-webkit-font-smoothing:antialiased}rolatech-tab:hover{background-color:#f3f4f6}\n"] }]
|
|
1314
1314
|
}], propDecorators: { hasId: [{
|
|
1315
1315
|
type: HostBinding,
|
|
1316
1316
|
args: ['id']
|
|
@@ -1329,6 +1329,7 @@ class TabsComponent {
|
|
|
1329
1329
|
clientWidths = [];
|
|
1330
1330
|
ngOnInit() { }
|
|
1331
1331
|
ngAfterViewInit() {
|
|
1332
|
+
const gap = 24; // 24 = 2 * margin-left
|
|
1332
1333
|
this.tabs()[this.select()].nativeElement.setAttribute('style-target', 'host');
|
|
1333
1334
|
const selectionBarElement = this.selectionBar()?.nativeElement;
|
|
1334
1335
|
selectionBarElement.setAttribute('style-target', 'selection-bar');
|
|
@@ -1339,12 +1340,12 @@ class TabsComponent {
|
|
|
1339
1340
|
this.tabs()[this.preSelect].nativeElement.removeAttribute('style-target');
|
|
1340
1341
|
this.tabs()[index].nativeElement.setAttribute('style-target', 'host');
|
|
1341
1342
|
selectionBarElement.style.left = this.getOffset(index) + 'px';
|
|
1342
|
-
selectionBarElement.style.width = element.nativeElement.clientWidth + 'px';
|
|
1343
|
+
selectionBarElement.style.width = element.nativeElement.clientWidth - gap + 'px';
|
|
1343
1344
|
this.preSelect = index;
|
|
1344
1345
|
});
|
|
1345
1346
|
});
|
|
1346
1347
|
selectionBarElement.style.left = this.getOffset(this.select()) + 'px';
|
|
1347
|
-
selectionBarElement.style.width = this.clientWidths[this.select()] + 'px';
|
|
1348
|
+
selectionBarElement.style.width = this.clientWidths[this.select()] - gap + 'px';
|
|
1348
1349
|
this.preSelect = this.select();
|
|
1349
1350
|
}
|
|
1350
1351
|
init() {
|
|
@@ -1353,18 +1354,21 @@ class TabsComponent {
|
|
|
1353
1354
|
selectionBarElement.setAttribute('style-target', 'selection-bar');
|
|
1354
1355
|
}
|
|
1355
1356
|
getOffset(index) {
|
|
1357
|
+
// gap: tab's margin-left + margin-right
|
|
1358
|
+
const gap = 24;
|
|
1356
1359
|
let offset = 0;
|
|
1357
1360
|
for (let i = 0; i < index; i++) {
|
|
1358
|
-
offset += this.clientWidths[i] +
|
|
1361
|
+
// offset += this.clientWidths[i] + gap; // Add the width of the element and the gap
|
|
1362
|
+
offset += this.clientWidths[i]; // Add the width of the element and the gap
|
|
1359
1363
|
}
|
|
1360
1364
|
return offset;
|
|
1361
1365
|
}
|
|
1362
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1363
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
1366
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1367
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: TabsComponent, isStandalone: true, selector: "rolatech-tabs", inputs: { select: { classPropertyName: "select", publicName: "select", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { select: "selectChange" }, host: { properties: { "class.rolatech-tabs": "this.hasClass" } }, queries: [{ propertyName: "tabs", predicate: TabComponent, read: ElementRef, isSignal: true }], viewQueries: [{ propertyName: "selectionBar", first: true, predicate: ["selectionBar"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<!-- <rolatech-icon-button>chevron_left</rolatech-icon-button> -->\n<div id=\"tabsContainer\" class=\"h-full\">\n <div id=\"tabsContent\" class=\"flex flex-row h-full\" style-target=\"selection-bar\">\n <div #selectionBar id=\"selectionBar\" class=\"selection-bar\"></div>\n @for (tab of tabs(); track $index) {\n <ng-content select=\"rolatech-tab\"></ng-content>\n }\n </div>\n <!-- <ng-content></ng-content> -->\n</div>\n<!-- <rolatech-icon-button>chevron_right</rolatech-icon-button> -->\n", styles: ["rolatech-tabs{display:flex;flex-direction:row;align-items:center;font-weight:500;height:44px}.selection-bar{position:absolute;height:0;bottom:0;left:0;right:0;border-bottom:2px solid var(--paper-tabs-selection-bar-color, #ffff8d);transform:scale(0);transform-origin:left center;transition:-webkit-transform;transition:transform;z-index:100}rolatech-tab[style-target=host]{color:#ea580c}.selection-bar[style-target=selection-bar]{transition:width .15s cubic-bezier(.4,0,1,1),left .15s cubic-bezier(.4,0,1,1)}.selection-bar[style-target=selection-bar]{border-width:0;background-color:var(--ytcms-policies-app-paper-tab-color, rgb(234, 88, 12));border-radius:3px 3px 0 0;height:3px;margin-left:12px;right:auto;transform:none}#tabsContainer{position:relative}#tabsContent>:not(#selectionBar){height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1364
1368
|
}
|
|
1365
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1369
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: TabsComponent, decorators: [{
|
|
1366
1370
|
type: Component,
|
|
1367
|
-
args: [{ selector: 'rolatech-tabs', standalone: true, imports: [CommonModule, IconButtonComponent], encapsulation: ViewEncapsulation.None, template: "<!-- <rolatech-icon-button>chevron_left</rolatech-icon-button> -->\n<div id=\"tabsContainer\" class=\"h-full\">\n <div id=\"tabsContent\" class=\"flex flex-row h-full\" style-target=\"selection-bar\">\n <div #selectionBar id=\"selectionBar\" class=\"selection-bar\"></div>\n @for (tab of tabs(); track $index) {\n <ng-content select=\"rolatech-tab\"></ng-content>\n }\n </div>\n <!-- <ng-content></ng-content> -->\n</div>\n<!-- <rolatech-icon-button>chevron_right</rolatech-icon-button> -->\n", styles: ["rolatech-tabs{display:flex;flex-direction:row;align-items:center;font-weight:500;height:44px}.selection-bar{position:absolute;height:0;bottom:0;left:0;right:0;border-bottom:2px solid var(--paper-tabs-selection-bar-color, #ffff8d);transform:scale(0);transform-origin:left center;transition:-webkit-transform;transition:transform}rolatech-tab[style-target=host]{
|
|
1371
|
+
args: [{ selector: 'rolatech-tabs', standalone: true, imports: [CommonModule, IconButtonComponent], encapsulation: ViewEncapsulation.None, template: "<!-- <rolatech-icon-button>chevron_left</rolatech-icon-button> -->\n<div id=\"tabsContainer\" class=\"h-full\">\n <div id=\"tabsContent\" class=\"flex flex-row h-full\" style-target=\"selection-bar\">\n <div #selectionBar id=\"selectionBar\" class=\"selection-bar\"></div>\n @for (tab of tabs(); track $index) {\n <ng-content select=\"rolatech-tab\"></ng-content>\n }\n </div>\n <!-- <ng-content></ng-content> -->\n</div>\n<!-- <rolatech-icon-button>chevron_right</rolatech-icon-button> -->\n", styles: ["rolatech-tabs{display:flex;flex-direction:row;align-items:center;font-weight:500;height:44px}.selection-bar{position:absolute;height:0;bottom:0;left:0;right:0;border-bottom:2px solid var(--paper-tabs-selection-bar-color, #ffff8d);transform:scale(0);transform-origin:left center;transition:-webkit-transform;transition:transform;z-index:100}rolatech-tab[style-target=host]{color:#ea580c}.selection-bar[style-target=selection-bar]{transition:width .15s cubic-bezier(.4,0,1,1),left .15s cubic-bezier(.4,0,1,1)}.selection-bar[style-target=selection-bar]{border-width:0;background-color:var(--ytcms-policies-app-paper-tab-color, rgb(234, 88, 12));border-radius:3px 3px 0 0;height:3px;margin-left:12px;right:auto;transform:none}#tabsContainer{position:relative}#tabsContent>:not(#selectionBar){height:100%}\n"] }]
|
|
1368
1372
|
}], propDecorators: { hasClass: [{
|
|
1369
1373
|
type: HostBinding,
|
|
1370
1374
|
args: ['class.rolatech-tabs']
|