@rs-pk/asset-management 1.0.28 → 1.0.29
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/bundles/rs-pk-asset-management.umd.js +106 -55
- package/bundles/rs-pk-asset-management.umd.js.map +1 -1
- package/bundles/rs-pk-asset-management.umd.min.js +2 -2
- package/bundles/rs-pk-asset-management.umd.min.js.map +1 -1
- package/esm2015/lib/components/partial/asset-item/asset-item.component.js +6 -3
- package/esm2015/lib/components/partial/asset-list/asset-list.component.js +14 -6
- package/esm2015/lib/components/partial/asset-management-dialog/asset-management-dialog.component.js +2 -2
- package/esm2015/lib/components/partial/asset-wrapper/asset-wrapper.component.js +5 -2
- package/esm2015/lib/components/partial/file-list/file-list.component.js +1 -1
- package/esm2015/lib/components/partial/node-details/node-details.component.js +13 -4
- package/esm2015/lib/components/partial/node-tree/node-tree.component.js +36 -34
- package/esm2015/lib/components/partial/search-box/search-box.component.js +10 -5
- package/esm2015/lib/components/ui/modal/modal.component.js +1 -1
- package/esm2015/lib/datasources/node-tree.datasource.js +4 -3
- package/esm2015/lib/services/asset.service.js +7 -5
- package/esm2015/lib/services/node-tree.service.js +16 -12
- package/esm5/lib/components/partial/asset-item/asset-item.component.js +6 -3
- package/esm5/lib/components/partial/asset-list/asset-list.component.js +14 -6
- package/esm5/lib/components/partial/asset-management-dialog/asset-management-dialog.component.js +2 -2
- package/esm5/lib/components/partial/asset-wrapper/asset-wrapper.component.js +5 -2
- package/esm5/lib/components/partial/file-list/file-list.component.js +1 -1
- package/esm5/lib/components/partial/node-details/node-details.component.js +13 -4
- package/esm5/lib/components/partial/node-tree/node-tree.component.js +48 -37
- package/esm5/lib/components/partial/search-box/search-box.component.js +10 -5
- package/esm5/lib/components/ui/modal/modal.component.js +1 -1
- package/esm5/lib/datasources/node-tree.datasource.js +5 -3
- package/esm5/lib/services/asset.service.js +9 -5
- package/esm5/lib/services/node-tree.service.js +17 -11
- package/fesm2015/rs-pk-asset-management.js +89 -52
- package/fesm2015/rs-pk-asset-management.js.map +1 -1
- package/fesm5/rs-pk-asset-management.js +105 -54
- package/fesm5/rs-pk-asset-management.js.map +1 -1
- package/lib/components/partial/asset-item/asset-item.component.d.ts +1 -0
- package/lib/components/partial/asset-list/asset-list.component.d.ts +1 -0
- package/lib/components/partial/asset-wrapper/asset-wrapper.component.d.ts +1 -0
- package/lib/components/partial/node-details/node-details.component.d.ts +1 -0
- package/lib/components/partial/node-tree/node-tree.component.d.ts +7 -7
- package/lib/datasources/node-tree.datasource.d.ts +1 -1
- package/lib/services/asset.service.d.ts +1 -1
- package/lib/services/node-tree.service.d.ts +6 -6
- package/package.json +3 -4
- package/rs-pk-asset-management.metadata.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
2
|
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/material/dialog'), require('@angular/material/button'), require('@angular/material/input'), require('@angular/material/icon'), require('@angular/material/tooltip'), require('@angular/material/tree'), require('@angular/material/paginator'), require('@angular/material/table'), require('@angular/material/progress-bar'), require('@angular/material/menu'), require('@angular/material/checkbox'), require('@angular/material/select'), require('@angular/material/progress-spinner'), require('@angular/common/http'), require('rxjs'), require('rxjs/internal/BehaviorSubject'), require('rxjs/operators'), require('rxjs/internal/Subject'), require('@angular/platform-browser'), require('@angular/material'), require('rxjs/internal/observable/of'), require('@angular/cdk/tree'), require('rxjs/internal/observable/combineLatest'), require('moment')) :
|
|
3
3
|
typeof define === 'function' && define.amd ? define('@rs-pk/asset-management', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/material/dialog', '@angular/material/button', '@angular/material/input', '@angular/material/icon', '@angular/material/tooltip', '@angular/material/tree', '@angular/material/paginator', '@angular/material/table', '@angular/material/progress-bar', '@angular/material/menu', '@angular/material/checkbox', '@angular/material/select', '@angular/material/progress-spinner', '@angular/common/http', 'rxjs', 'rxjs/internal/BehaviorSubject', 'rxjs/operators', 'rxjs/internal/Subject', '@angular/platform-browser', '@angular/material', 'rxjs/internal/observable/of', '@angular/cdk/tree', 'rxjs/internal/observable/combineLatest', 'moment'], factory) :
|
|
4
|
-
(global = global || self, factory((global['rs-pk'] = global['rs-pk'] || {}, global['rs-pk']['asset-management'] = {}), global.ng.core, global.ng.common, global.ng.forms, global.ng.material.dialog, global.ng.material.button, global.ng.material.input, global.ng.material.icon, global.ng.material.tooltip, global.ng.material.tree, global.ng.material.paginator, global.ng.material.table, global.ng.material
|
|
4
|
+
(global = global || self, factory((global['rs-pk'] = global['rs-pk'] || {}, global['rs-pk']['asset-management'] = {}), global.ng.core, global.ng.common, global.ng.forms, global.ng.material.dialog, global.ng.material.button, global.ng.material.input, global.ng.material.icon, global.ng.material.tooltip, global.ng.material.tree, global.ng.material.paginator, global.ng.material.table, global.ng.material.progressBar, global.ng.material.menu, global.ng.material.checkbox, global.ng.material.select, global.ng.material.progressSpinner, global.ng.common.http, global.rxjs, global.rxjs['internal/BehaviorSubject'], global.rxjs.operators, global.rxjs['internal/Subject'], global.ng.platformBrowser, global.ng.material, global.rxjs['internal/observable/of'], global.ng.cdk.tree, global.rxjs['internal/observable/combineLatest'], global.moment_));
|
|
5
5
|
}(this, (function (exports, core, common, forms, dialog, button, input, icon, tooltip, tree, paginator, table, progressBar, menu, checkbox, select$1, progressSpinner, http, rxjs, BehaviorSubject, operators, Subject, platformBrowser, material, of, tree$1, combineLatest, moment_) { 'use strict';
|
|
6
6
|
|
|
7
7
|
/*! *****************************************************************************
|
|
@@ -809,15 +809,17 @@
|
|
|
809
809
|
/**
|
|
810
810
|
* @param {?} assets
|
|
811
811
|
* @param {?=} pagination
|
|
812
|
+
* @param {?=} totalFile
|
|
812
813
|
* @return {?}
|
|
813
814
|
*/
|
|
814
815
|
AssetService.prototype.setAssetList = /**
|
|
815
816
|
* @param {?} assets
|
|
816
817
|
* @param {?=} pagination
|
|
818
|
+
* @param {?=} totalFile
|
|
817
819
|
* @return {?}
|
|
818
820
|
*/
|
|
819
|
-
function (assets, pagination) {
|
|
820
|
-
this.setPagination(pagination);
|
|
821
|
+
function (assets, pagination, totalFile) {
|
|
822
|
+
this.setPagination(pagination, totalFile);
|
|
821
823
|
this.assetList$.next(assets);
|
|
822
824
|
};
|
|
823
825
|
/**
|
|
@@ -843,16 +845,18 @@
|
|
|
843
845
|
/**
|
|
844
846
|
* @private
|
|
845
847
|
* @param {?} pagination
|
|
848
|
+
* @param {?} totalFile
|
|
846
849
|
* @return {?}
|
|
847
850
|
*/
|
|
848
851
|
AssetService.prototype.setPagination = /**
|
|
849
852
|
* @private
|
|
850
853
|
* @param {?} pagination
|
|
854
|
+
* @param {?} totalFile
|
|
851
855
|
* @return {?}
|
|
852
856
|
*/
|
|
853
|
-
function (pagination) {
|
|
857
|
+
function (pagination, totalFile) {
|
|
854
858
|
if (pagination) {
|
|
855
|
-
this.fileTotal =
|
|
859
|
+
this.fileTotal = totalFile || 0;
|
|
856
860
|
this.pageIndex = pagination.PageIndex;
|
|
857
861
|
this.pageSize = pagination.PageSize;
|
|
858
862
|
}
|
|
@@ -1360,21 +1364,25 @@
|
|
|
1360
1364
|
/**
|
|
1361
1365
|
* @private
|
|
1362
1366
|
* @param {?} id
|
|
1367
|
+
* @param {?=} pageSize
|
|
1363
1368
|
* @return {?}
|
|
1364
1369
|
*/
|
|
1365
1370
|
NodeTreeService.prototype.fetchChildrenFolder = /**
|
|
1366
1371
|
* @private
|
|
1367
1372
|
* @param {?} id
|
|
1373
|
+
* @param {?=} pageSize
|
|
1368
1374
|
* @return {?}
|
|
1369
1375
|
*/
|
|
1370
|
-
function (id) {
|
|
1376
|
+
function (id, pageSize) {
|
|
1371
1377
|
return __awaiter(this, void 0, void 0, function () {
|
|
1372
1378
|
var result, err_1;
|
|
1373
1379
|
return __generator(this, function (_a) {
|
|
1374
1380
|
switch (_a.label) {
|
|
1375
1381
|
case 0:
|
|
1376
1382
|
_a.trys.push([0, 2, , 3]);
|
|
1377
|
-
return [4 /*yield*/, this.assetService
|
|
1383
|
+
return [4 /*yield*/, this.assetService
|
|
1384
|
+
.getChildrenFolders({ assetId: id, isFilter: false, pageSize: pageSize || this.assetService.AMConfig.pageFolderSize || MAX_FOLDER_TREE_SIZE })
|
|
1385
|
+
.toPromise()];
|
|
1378
1386
|
case 1:
|
|
1379
1387
|
result = _a.sent();
|
|
1380
1388
|
if (result) {
|
|
@@ -1458,17 +1466,19 @@
|
|
|
1458
1466
|
};
|
|
1459
1467
|
/**
|
|
1460
1468
|
* @param {?} node
|
|
1469
|
+
* @param {?=} pageSize
|
|
1461
1470
|
* @return {?}
|
|
1462
1471
|
*/
|
|
1463
1472
|
NodeTreeService.prototype.getChildren = /**
|
|
1464
1473
|
* @param {?} node
|
|
1474
|
+
* @param {?=} pageSize
|
|
1465
1475
|
* @return {?}
|
|
1466
1476
|
*/
|
|
1467
|
-
function (node) {
|
|
1477
|
+
function (node, pageSize) {
|
|
1468
1478
|
return __awaiter(this, void 0, void 0, function () {
|
|
1469
1479
|
return __generator(this, function (_a) {
|
|
1470
1480
|
switch (_a.label) {
|
|
1471
|
-
case 0: return [4 /*yield*/, this.fetchChildrenFolder(node.AssetId)];
|
|
1481
|
+
case 0: return [4 /*yield*/, this.fetchChildrenFolder(node.AssetId, pageSize)];
|
|
1472
1482
|
case 1: return [2 /*return*/, _a.sent()];
|
|
1473
1483
|
}
|
|
1474
1484
|
});
|
|
@@ -2024,7 +2034,7 @@
|
|
|
2024
2034
|
AssetManagementDialogComponent.decorators = [
|
|
2025
2035
|
{ type: core.Component, args: [{
|
|
2026
2036
|
selector: 'lib-asset-management-dialog',
|
|
2027
|
-
template: "<lib-modal heading=\"Asset management\" [customHeader]=\"true\">\n <ng-container subtitle>\n <lib-breadcrumb></lib-breadcrumb>\n </ng-container>\n <ng-container headerActions>\n <lib-search-box></lib-search-box>\n </ng-container>\n <ng-container content>\n <lib-asset-wrapper
|
|
2037
|
+
template: "<lib-modal heading=\"Asset management\" [customHeader]=\"true\">\n <ng-container subtitle>\n <lib-breadcrumb></lib-breadcrumb>\n </ng-container>\n <ng-container headerActions>\n <lib-search-box></lib-search-box>\n </ng-container>\n <ng-container content>\n <lib-asset-wrapper\n [header]=\"false\"\n [isDialog]=\"true\"\n [hasModifyPermission]=\"data.permission.modify\"\n [hasAccessPermission]=\"data.permission.access\"\n [hasArchivePermission]=\"data.permission.archive\"\n ></lib-asset-wrapper>\n </ng-container>\n <ng-container actions>\n <div class=\"asset-management-dialog__footer\">\n <div class=\"selected-assets\">\n <ng-container *ngIf=\"data?.limit\">\n <span>Selected{{' '}}</span>\n <span class=\"count\" [ngClass]=\"{'error': selectedAssets?.length && disabled}\">\n {{selectedAssets?.length}}/{{data?.limit}}\n </span>\n <span>\n {{data?.limit > 1 ? \"assets\": \"asset\"}}\n </span>\n </ng-container>\n </div>\n <div>\n <button mat-raised-button mat-dialog-close>Cancel</button>\n <button mat-raised-button color=\"primary\" (click)=\"selectAssets()\" [disabled]=\"disabled\">Done</button>\n </div>\n </div>\n </ng-container>\n</lib-modal>",
|
|
2028
2038
|
styles: [":host::ng-deep .asset-management-dialog__footer{display:flex;width:100%;align-items:center;justify-content:space-between}:host::ng-deep .asset-management-dialog__footer .selected-assets{font-size:14px;color:#979797}:host::ng-deep .asset-management-dialog__footer .selected-assets .count{color:#000}:host::ng-deep .asset-management-dialog__footer .selected-assets .error{color:#f44336}"]
|
|
2029
2039
|
}] }
|
|
2030
2040
|
];
|
|
@@ -2449,7 +2459,7 @@
|
|
|
2449
2459
|
{ type: core.Component, args: [{
|
|
2450
2460
|
selector: 'lib-modal',
|
|
2451
2461
|
template: "<h4 mat-dialog-title *ngIf=\"!customHeader; else customHeaderTemplate\">\n <div class=\"lib-modal--title\" [title]=\"heading\">\n {{ heading }}\n </div>\n <div class=\"lib-modal--close\">\n <mat-icon mat-dialog-close>close</mat-icon>\n </div>\n</h4>\n<ng-template #customHeaderTemplate>\n <h4 mat-dialog-title>\n <div class=\"lib-modal--custom-title\">\n <span>\n {{ heading }}\n </span>\n <div class=\"lib-modal--custom-subtitle\">\n <ng-content select=\"[subtitle]\"></ng-content>\n </div>\n </div>\n <div class=\"lib-modal--header-actions\">\n <ng-content select=\"[headerActions]\"></ng-content>\n </div>\n <mat-icon mat-dialog-close class=\"mat-dialog-close\">close</mat-icon>\n </h4>\n</ng-template>\n<mat-dialog-content class=\"custom-scrollbar\">\n <ng-content select=\"[content]\"></ng-content>\n</mat-dialog-content>\n<mat-dialog-actions>\n <ng-content select=\"[actions]\"></ng-content>\n</mat-dialog-actions>\n",
|
|
2452
|
-
styles: [":host::ng-deep{display:flex;flex-direction:column;min-height:150px;position:relative}:host::ng-deep .mat-dialog-title{padding-bottom:24px;margin:0;display:flex;justify-content:space-between;font-size:24px;line-height:1;gap:10px}:host::ng-deep .mat-dialog-title mat-icon{cursor:pointer}:host::ng-deep .lib-modal--custom-title,:host::ng-deep .lib-modal--title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host::ng-deep .lib-modal--custom-subtitle{margin-top:5px}:host::ng-deep .lib-modal--header-actions{display:flex;align-items:center;gap:10px}:host::ng-deep mat-dialog-content{flex:1;padding:0 24px}:host::ng-deep mat-dialog-actions{padding-top:24px;padding-bottom:0;display:flex;justify-content:flex-end;min-height:auto;margin-bottom:0}:host::ng-deep mat-dialog-actions .mat-button-base+.mat-button-base{margin-left:20px}:host::ng-deep .mat-error{margin-top:5px;font-size:14px}:host::ng-deep .no-wrap{white-space:nowrap}:host::ng-deep input,:host::ng-deep textarea{width:100%;padding:10px;border:1px solid #d8d8d8;border-radius:5px;color:#000;margin-top:0;resize:none}::ng-deep .lib-dialog--small{width:400px!important}::ng-deep .lib-dialog--small .file__name{word-break:break-word}::ng-deep .lib-dialog--small .mat-button-base{min-width:70px}::ng-deep .lib-dialog--small .loading{padding:0 5px}::ng-deep .lib-dialog--small .loading .mat-button-wrapper{display:flex;width:100%;justify-content:center;align-items:center}::ng-deep .lib-dialog--small .loading .mat-spinner{margin-right:10px}::ng-deep .lib-dialog--medium{max-width:1200px!important;width:90%!important}::ng-deep .lib-dialog--medium .mat-dialog-content{border-top:1px solid #d8d8d8;border-bottom:1px solid #d8d8d8;overflow-x:hidden}::ng-deep .lib-dialog--large{max-width:1200px!important;width:90vw!important}::ng-deep .lib-dialog--large .mat-dialog-title{padding-bottom:12px;position:relative}::ng-deep .lib-dialog--large .mat-dialog-title .mat-dialog-close{position:absolute;right:-22px;top:-22px}::ng-deep .lib-dialog--large .mat-dialog-content{min-height:70vh;border-top:1px solid #d8d8d8;border-bottom:1px solid #d8d8d8;padding:0}::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body{max-height:calc(70vh - 2px)!important}::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body .node-tree{height:calc(70vh - 2px)!important}::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body .asset-list__item{min-width:25%!important}@media only screen and (max-width:768px){::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body{max-height:none!important}::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body .node-tree{height:-
|
|
2462
|
+
styles: [":host::ng-deep{display:flex;flex-direction:column;min-height:150px;position:relative}:host::ng-deep .mat-dialog-title{padding-bottom:24px;margin:0;display:flex;justify-content:space-between;font-size:24px;line-height:1;gap:10px}:host::ng-deep .mat-dialog-title mat-icon{cursor:pointer}:host::ng-deep .lib-modal--custom-title,:host::ng-deep .lib-modal--title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host::ng-deep .lib-modal--custom-subtitle{margin-top:5px}:host::ng-deep .lib-modal--header-actions{display:flex;align-items:center;gap:10px}:host::ng-deep mat-dialog-content{flex:1;padding:0 24px}:host::ng-deep mat-dialog-actions{padding-top:24px;padding-bottom:0;display:flex;justify-content:flex-end;min-height:auto;margin-bottom:0}:host::ng-deep mat-dialog-actions .mat-button-base+.mat-button-base{margin-left:20px}:host::ng-deep .mat-error{margin-top:5px;font-size:14px}:host::ng-deep .no-wrap{white-space:nowrap}:host::ng-deep input,:host::ng-deep textarea{width:100%;padding:10px;border:1px solid #d8d8d8;border-radius:5px;color:#000;margin-top:0;resize:none}::ng-deep .lib-dialog--small{width:400px!important}::ng-deep .lib-dialog--small .file__name{word-break:break-word}::ng-deep .lib-dialog--small .mat-button-base{min-width:70px}::ng-deep .lib-dialog--small .loading{padding:0 5px}::ng-deep .lib-dialog--small .loading .mat-button-wrapper{display:flex;width:100%;justify-content:center;align-items:center}::ng-deep .lib-dialog--small .loading .mat-spinner{margin-right:10px}::ng-deep .lib-dialog--medium{max-width:1200px!important;width:90%!important}::ng-deep .lib-dialog--medium .mat-dialog-content{border-top:1px solid #d8d8d8;border-bottom:1px solid #d8d8d8;overflow-x:hidden}::ng-deep .lib-dialog--large{max-width:1200px!important;width:90vw!important}::ng-deep .lib-dialog--large .mat-dialog-title{padding-bottom:12px;position:relative}::ng-deep .lib-dialog--large .mat-dialog-title .mat-dialog-close{position:absolute;right:-22px;top:-22px}::ng-deep .lib-dialog--large .mat-dialog-content{min-height:70vh;border-top:1px solid #d8d8d8;border-bottom:1px solid #d8d8d8;padding:0}::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body{max-height:calc(70vh - 2px)!important}::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body .node-tree{height:calc(70vh - 2px)!important}::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body .asset-list__item{min-width:25%!important}@media only screen and (max-width:768px){::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body{max-height:none!important}::ng-deep .lib-dialog--large .mat-dialog-content .asset-wrapper .asset-body .node-tree{height:-moz-max-content!important;height:max-content!important}}::ng-deep .lib-dialog--large .mat-dialog-actions{padding:12px 0;margin-bottom:-24px!important}"]
|
|
2453
2463
|
}] }
|
|
2454
2464
|
];
|
|
2455
2465
|
/** @nocollapse */
|
|
@@ -2802,7 +2812,7 @@
|
|
|
2802
2812
|
{ type: core.Component, args: [{
|
|
2803
2813
|
selector: 'lib-file-list',
|
|
2804
2814
|
template: "<div class=\"file-list__heading\">\n <div class=\"file-list__info\">\n <h4 class=\"file-list__info--title\">\n <span *ngIf=\"!uploadAssetsService.errorLength\">\n {{\n uploadAssetsService?.getFiles?.length -\n uploadAssetsService.errorLength\n }}\n {{ uploadAssetsService?.getFiles?.length > 1 ? 'assets' : 'asset' }}\n ready to upload\n </span>\n <span *ngIf=\"uploadAssetsService.errorLength\">\n {{ uploadAssetsService.errorLength }}\n {{ uploadAssetsService.errorLength > 1 ? 'assets' : 'asset' }}\n invalid, please remove it before upload</span\n >\n </h4>\n <div class=\"file-list__info--desc\">\n Manage the assets before adding them to the Media Library\n </div>\n </div>\n <lib-input-file\n [acceptTypes]=\"uploadAssetsService?.supportedTypes?.join(', ')\"\n (onFileChange)=\"onFileChange($event)\"\n color=\"primary\"\n >\n <span>Add new assets</span>\n </lib-input-file>\n</div>\n<div class=\"file-list\">\n <lib-file-item\n *ngFor=\"let file of uploadAssetsService?.getFiles; let i = index\"\n [file]=\"file\"\n (checkError)=\"onEmitError()\"\n (fileRemove)=\"onDelFile(i)\"\n (fileChange)=\"onChangeName($event, i)\"\n ></lib-file-item>\n</div>\n",
|
|
2805
|
-
styles: [":host::ng-deep .file-list{padding-top:15px}:host::ng-deep .file-list__heading{display:flex;justify-content:space-between;align-items:center;padding-top:15px;padding-bottom:15px;position
|
|
2815
|
+
styles: [":host::ng-deep .file-list{padding-top:15px}:host::ng-deep .file-list__heading{display:flex;justify-content:space-between;align-items:center;padding-top:15px;padding-bottom:15px;position:sticky;top:0;background-color:#fff}:host::ng-deep .file-list__info--title{font-size:16px;margin-bottom:5px;color:#000}:host::ng-deep lib-file-item{margin-bottom:20px}"]
|
|
2806
2816
|
}] }
|
|
2807
2817
|
];
|
|
2808
2818
|
/** @nocollapse */
|
|
@@ -3981,9 +3991,14 @@
|
|
|
3981
3991
|
* @return {?}
|
|
3982
3992
|
*/
|
|
3983
3993
|
function (res) {
|
|
3984
|
-
|
|
3985
|
-
|
|
3986
|
-
|
|
3994
|
+
/** @type {?} */
|
|
3995
|
+
var pagination = res && res.Meta || {};
|
|
3996
|
+
/** @type {?} */
|
|
3997
|
+
var assets = res && res.Data && res.Data.Children || [];
|
|
3998
|
+
/** @type {?} */
|
|
3999
|
+
var totalFile = res && res.Data && res.Data.TotalFile || 0;
|
|
4000
|
+
_this.assetService.setAssetList(assets, pagination, totalFile);
|
|
4001
|
+
})).add((/**
|
|
3987
4002
|
* @return {?}
|
|
3988
4003
|
*/
|
|
3989
4004
|
function () {
|
|
@@ -4032,8 +4047,8 @@
|
|
|
4032
4047
|
AssetListComponent.decorators = [
|
|
4033
4048
|
{ type: core.Component, args: [{
|
|
4034
4049
|
selector: 'lib-asset-list',
|
|
4035
|
-
template: "<div class=\"asset-container\">\n <div class=\"asset-heading\">\n <h6 class=\"asset-heading__title\">Files</h6>\n <lib-sort-items\n [hidden]=\"!assets?.length\"\n class=\"asset-heading__sort\"\n ></lib-sort-items>\n </div>\n <ng-container *ngIf=\"assets && !assets.length; else assetsTemplate\">\n <div class=\"asset-empty\">\n <span>This asset is empty.</span>\n </div>\n </ng-container>\n <ng-template #assetsTemplate>\n <div class=\"asset-list\">\n <lib-asset-item\n class=\"asset-list__item\"\n *ngFor=\"let asset of assets\"\n [asset]=\"asset\"\n (selectAsset)=\"onSelectAsset($event)\"\n [hasModifyPermission]=\"hasModifyPermission\"\n [hasAccessPermission]=\"hasAccessPermission\"\n [hasArchivePermission]=\"hasArchivePermission\"\n >\n </lib-asset-item>\n </div>\n </ng-template>\n <div [hidden]=\"!assets?.length\">\n <mat-paginator\n #paginator\n [pageSizeOptions]=\"[12, 24, 60, 120]\"\n (page)=\"pageChange($event)\"\n [showFirstLastButtons]=\"true\"\n >\n </mat-paginator>\n </div>\n</div>\n",
|
|
4036
|
-
styles: [":host::ng-deep .asset-container .asset-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}:host::ng-deep .asset-container .asset-heading__title{margin-bottom:0;color:#979797}:host::ng-deep .asset-container .asset-list{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:stretch;margin:0 -5px}:host::ng-deep .asset-container .asset-list__item{width:25%}@media only screen and (max-width:1200px){:host::ng-deep .asset-container .asset-list__item{width:
|
|
4050
|
+
template: "<div class=\"asset-container\">\n <div class=\"asset-heading\">\n <h6 class=\"asset-heading__title\">Files</h6>\n <lib-sort-items\n [hidden]=\"!assets?.length\"\n class=\"asset-heading__sort\"\n ></lib-sort-items>\n </div>\n <ng-container *ngIf=\"assets && !assets.length; else assetsTemplate\">\n <div class=\"asset-empty\">\n <span>This asset is empty.</span>\n </div>\n </ng-container>\n <ng-template #assetsTemplate>\n <div class=\"asset-list\">\n <lib-asset-item\n class=\"asset-list__item\"\n *ngFor=\"let asset of assets\"\n [asset]=\"asset\"\n [isDialog]=\"isDialog\"\n (selectAsset)=\"onSelectAsset($event)\"\n [hasModifyPermission]=\"hasModifyPermission\"\n [hasAccessPermission]=\"hasAccessPermission\"\n [hasArchivePermission]=\"hasArchivePermission\"\n >\n </lib-asset-item>\n </div>\n </ng-template>\n <div [hidden]=\"!assets?.length\">\n <mat-paginator\n #paginator\n [pageSizeOptions]=\"[12, 24, 60, 120]\"\n (page)=\"pageChange($event)\"\n [showFirstLastButtons]=\"true\"\n >\n </mat-paginator>\n </div>\n</div>\n",
|
|
4051
|
+
styles: [":host::ng-deep .asset-container .asset-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}:host::ng-deep .asset-container .asset-heading__title{margin-bottom:0;color:#979797}:host::ng-deep .asset-container .asset-list{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:stretch;margin:0 -5px}:host::ng-deep .asset-container .asset-list__item{width:25%}@media only screen and (max-width:1200px){:host::ng-deep .asset-container .asset-list__item{width:33.3333333333%}}@media only screen and (max-width:960px){:host::ng-deep .asset-container .asset-list__item{width:50%}}:host::ng-deep .asset-container .asset-empty{text-align:center;color:#979797;font-size:14px}"]
|
|
4037
4052
|
}] }
|
|
4038
4053
|
];
|
|
4039
4054
|
/** @nocollapse */
|
|
@@ -4042,6 +4057,7 @@
|
|
|
4042
4057
|
{ type: AssetManagementService }
|
|
4043
4058
|
]; };
|
|
4044
4059
|
AssetListComponent.propDecorators = {
|
|
4060
|
+
isDialog: [{ type: core.Input }],
|
|
4045
4061
|
hasModifyPermission: [{ type: core.Input }],
|
|
4046
4062
|
hasAccessPermission: [{ type: core.Input }],
|
|
4047
4063
|
hasArchivePermission: [{ type: core.Input }],
|
|
@@ -4051,6 +4067,8 @@
|
|
|
4051
4067
|
return AssetListComponent;
|
|
4052
4068
|
}());
|
|
4053
4069
|
if (false) {
|
|
4070
|
+
/** @type {?} */
|
|
4071
|
+
AssetListComponent.prototype.isDialog;
|
|
4054
4072
|
/** @type {?} */
|
|
4055
4073
|
AssetListComponent.prototype.hasModifyPermission;
|
|
4056
4074
|
/** @type {?} */
|
|
@@ -4837,8 +4855,8 @@
|
|
|
4837
4855
|
AssetItemComponent.decorators = [
|
|
4838
4856
|
{ type: core.Component, args: [{
|
|
4839
4857
|
selector: 'lib-asset-item',
|
|
4840
|
-
template: "<div class=\"asset-wrapper\">\n <div class=\"asset-content\">\n <div class=\"asset-content__header\" *ngIf=\"asset?.BackgroudProcessingStatus === backgroundProcessingNum.Processed
|
|
4841
|
-
styles: [":host::ng-deep .asset-wrapper{padding:5px}:host::ng-deep .asset-wrapper .asset-content{overflow:hidden;position:relative;border-radius:10px;border:1px solid #d8d8d8;font-size:14px;transition:.3s cubic-bezier(.25,.8,.25,1)}:host::ng-deep .asset-wrapper .asset-content:hover{box-shadow:0 0 8px rgba(0,0,0,.17),0 0 0 rgba(0,0,0,.06)}:host::ng-deep .asset-wrapper .asset-content__header{position:absolute;z-index:1;top:0;left:0;width:100%;display:flex;justify-content:space-between;padding:14px}:host::ng-deep .asset-wrapper .asset-content__header--button{width:30px;height:30px;min-width:30px;display:flex;align-items:center;justify-content:center;text-align:center;color:rgba(0,0,0,.65);background:rgba(255,255,255,.6)}:host::ng-deep .asset-wrapper .asset-content__header--button:hover{background:#fff}:host::ng-deep .asset-wrapper .asset-content__header--button.edit-button{transition:.3s cubic-bezier(.25,.8,.25,1);opacity:0}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-icon{font-size:22px}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox{pointer-events:none;display:flex;align-items:center}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox .mat-checkbox-layout{display:block;margin:0}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox .mat-checkbox-layout .mat-checkbox-frame{color:#767676}:host::ng-deep .asset-wrapper .asset-content__body{padding-bottom:66.66%;background:#f1f1f1;position:relative}:host::ng-deep .asset-wrapper .asset-content__body img{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host::ng-deep .asset-wrapper .asset-content__body img.image{background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEBLAEsAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wAARCAAUABQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD+/ivFPFOf+EjvxzjbBgdv+PeDp+OfxzSt4q18AkageASB9ntu3OM+Vn8c5rsdG0fT9d06DVdUgN1f3XmefP5ksO/ypXhj/dwvHGu2ONF+VF3bQSM0AeYUV7IPCWgjgWRA/wCvi4P85SaKAPGm5Vh7H+VeyeERjQLEDoPP/WeQ/wAzRRQB0tFFFAH/2Q==)}:host::ng-deep .asset-wrapper .asset-content__body img.file{width:75%;height:75%}:host::ng-deep .asset-wrapper .asset-content__body .processing{background-color:#f1f1f1;width:100%;height:100%}:host::ng-deep .asset-wrapper .asset-content__body .processing .icon{
|
|
4858
|
+
template: "<div class=\"asset-wrapper\">\n <div class=\"asset-content\">\n <div class=\"asset-content__header\">\n <button class=\"asset-content__header--button\"\n *ngIf=\"(asset?.BackgroudProcessingStatus === backgroundProcessingNum.Processed) || (asset?.BackgroudProcessingStatus === backgroundProcessingNum.InProcessing)\"\n mat-raised-button (click)=\"onChange()\">\n <mat-checkbox class=\"checkbox\" [checked]=\"checkSelectedAsset\"></mat-checkbox>\n </button>\n <button class=\"asset-content__header--button edit-button\"\n *ngIf=\"asset?.BackgroudProcessingStatus === backgroundProcessingNum.Processed\" mat-raised-button\n (click)=\"editAsset()\">\n <mat-icon>edit</mat-icon>\n </button>\n </div>\n <div class=\"asset-content__body\">\n <ng-container [ngSwitch]=\"asset.FileType\">\n <ng-container *ngSwitchCase=\"fileType.IMAGE\">\n <img class=\"image\" [src]=\"asset.UrlThumbnail\" [alt]=\"asset.OriginalFileName\"\n *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.Processed\" />\n <!-- In Processing -->\n <div class=\"processing\" *ngIf=\"asset?.BackgroudProcessingStatus === backgroundProcessingNum.InProcessing\">\n <div class=\"upload-group\">\n <div>\n <mat-icon class=\"processing-icon\"\n [ngClass]=\"{ 'processing-icon-dialog': isDialog }\">cloud_upload</mat-icon>\n </div>\n <div>\n <span class=\"{{ isDialog ? 'processing-txt-dialog' : 'processing-txt' }}\">Uploading...</span>\n </div>\n </div>\n </div>\n\n <!-- Failed -->\n <div class=\"processing\" *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.Failed\">\n <div class=\"failed-group\">\n <div>\n <mat-icon class=\"processing-icon\"\n [ngClass]=\"{ 'processing-icon-dialog': isDialog }\">error_outline</mat-icon>\n </div>\n <div>\n <span class=\"{{ isDialog ? 'processing-txt-dialog' : 'processing-txt' }}\">Failed to upload the\n file</span>\n </div>\n <div class=\"btn-failed-group\">\n <button class=\"{{ isDialog ? 'btn-upload-dialog' : 'btn-upload' }}\"\n (click)=\"onUploadAgain(asset)\">Delete and update again</button>\n <span class=\"{{ isDialog ? 'processing-txt-dialog' : 'processing-txt' }} mx-1\">or</span>\n <button class=\"{{ isDialog ? 'btn-failed-dialog' : 'btn-failed' }}\"\n (click)=\"onDelete(asset)\">Delete</button>\n </div>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"fileType.DOCUMENT\">\n <img [src]=\"base64PNG[asset.Extension] || base64PNG.default\" [alt]=\"asset.OriginalFileName\" class=\"file\"\n *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.Processed\" />\n <!-- In Processing -->\n <div class=\"processing\" *ngIf=\"asset?.BackgroudProcessingStatus === backgroundProcessingNum.InProcessing\">\n <div class=\"upload-group\">\n <div>\n <mat-icon class=\"processing-icon\"\n [ngClass]=\"{ 'processing-icon-dialog': isDialog }\">cloud_upload</mat-icon>\n </div>\n <div>\n <span class=\"{{ isDialog ? 'processing-txt-dialog' : 'processing-txt' }}\">Uploading...</span>\n </div>\n </div>\n </div>\n\n <!-- Failed -->\n <div class=\"processing\" *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.Failed\">\n <div class=\"failed-group\">\n <mat-icon class=\"processing-icon\"\n [ngClass]=\"{ 'processing-icon-dialog': isDialog }\">error_outline</mat-icon>\n <div>\n <span class=\"{{ isDialog ? 'processing-txt-dialog' : 'processing-txt' }}\">Failed to upload the\n file</span>\n </div>\n <div class=\"btn-failed-group\">\n <button class=\"{{ isDialog ? 'btn-upload-dialog' : 'btn-upload' }}\"\n (click)=\"onUploadAgain(asset)\">Delete and update again</button>\n <span class=\"{{ isDialog ? 'processing-txt-dialog' : 'processing-txt' }} mx-1\">or</span>\n <button class=\"{{ isDialog ? 'btn-failed-dialog' : 'btn-failed' }}\"\n (click)=\"onDelete(asset)\">Delete</button>\n </div>\n </div>\n </div>\n </ng-container>\n </ng-container>\n </div>\n <div class=\"asset-content__footer\">\n <div class=\"asset-content__footer--info\" [ngClass]=\"{\n 'file-type__document': asset.FileType === fileType.DOCUMENT\n }\">\n <p class=\"name\" [matTooltip]=\"asset.OriginalFileNameWithoutExtension\" matTooltipClass=\"width-auto\">\n {{ asset.OriginalFileNameWithoutExtension }}\n </p>\n <p class=\"info\">\n <span class=\"extension\">{{ asset.Extension }}</span>\n <span *ngIf=\"\n asset.FileType === fileType.IMAGE && asset?.Extension !== 'svg'\n \">\n - {{ asset.Width }}x{{ asset.Height }}</span>\n <span *ngIf=\"asset.Size\"> - {{ asset.Size }}</span>\n </p>\n </div>\n <div class=\"asset-content__footer--file-type\">\n <span>{{ asset.FileType }}</span>\n </div>\n </div>\n </div>\n</div>",
|
|
4859
|
+
styles: [":host::ng-deep .asset-wrapper{padding:5px}:host::ng-deep .asset-wrapper .asset-content{overflow:hidden;position:relative;border-radius:10px;border:1px solid #d8d8d8;font-size:14px;transition:.3s cubic-bezier(.25,.8,.25,1)}:host::ng-deep .asset-wrapper .asset-content:hover{box-shadow:0 0 8px rgba(0,0,0,.17),0 0 0 rgba(0,0,0,.06)}:host::ng-deep .asset-wrapper .asset-content__header{position:absolute;z-index:1;top:0;left:0;width:100%;display:flex;justify-content:space-between;padding:14px}:host::ng-deep .asset-wrapper .asset-content__header--button{width:30px;height:30px;min-width:30px;display:flex;align-items:center;justify-content:center;text-align:center;color:rgba(0,0,0,.65);background:rgba(255,255,255,.6)}:host::ng-deep .asset-wrapper .asset-content__header--button:hover{background:#fff}:host::ng-deep .asset-wrapper .asset-content__header--button.edit-button{transition:.3s cubic-bezier(.25,.8,.25,1);opacity:0}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-icon{font-size:22px}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox{pointer-events:none;display:flex;align-items:center}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox .mat-checkbox-layout{display:block;margin:0}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox .mat-checkbox-layout .mat-checkbox-frame{color:#767676}:host::ng-deep .asset-wrapper .asset-content__body{padding-bottom:66.66%;background:#f1f1f1;position:relative}:host::ng-deep .asset-wrapper .asset-content__body img{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host::ng-deep .asset-wrapper .asset-content__body img.image{background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEBLAEsAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wAARCAAUABQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD+/ivFPFOf+EjvxzjbBgdv+PeDp+OfxzSt4q18AkageASB9ntu3OM+Vn8c5rsdG0fT9d06DVdUgN1f3XmefP5ksO/ypXhj/dwvHGu2ONF+VF3bQSM0AeYUV7IPCWgjgWRA/wCvi4P85SaKAPGm5Vh7H+VeyeERjQLEDoPP/WeQ/wAzRRQB0tFFFAH/2Q==)}:host::ng-deep .asset-wrapper .asset-content__body img.file{width:75%;height:75%}:host::ng-deep .asset-wrapper .asset-content__body .processing{background-color:#f1f1f1;width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host::ng-deep .asset-wrapper .asset-content__body .processing .processing-icon{font-size:35px;height:35px;width:35px}:host::ng-deep .asset-wrapper .asset-content__body .processing .processing-txt{font-size:17px}:host::ng-deep .asset-wrapper .asset-content__body .processing .processing-icon-dialog{font-size:24px;height:24px;width:24px}:host::ng-deep .asset-wrapper .asset-content__body .processing .processing-txt-dialog{font-size:13px}:host::ng-deep .asset-wrapper .asset-content__body .processing .upload-group{text-align:center}:host::ng-deep .asset-wrapper .asset-content__body .processing .failed-group{text-align:center;color:#f44336}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group{margin-top:7px}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-upload{font-size:13px;padding:5px;border:0;color:#fff;background-color:#ffc107;border-radius:3px}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-failed{font-size:13px;padding:5px;border:0;color:#fff;background-color:#f44336;border-radius:3px}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-upload-dialog{font-size:9px;border:0;color:#fff;background-color:#ffc107;border-radius:3px}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-failed-dialog{font-size:9px;border:0;color:#fff;background-color:#f44336;border-radius:3px}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-failed-dialog:hover,:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-failed:hover,:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-upload-dialog:hover,:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-upload:hover{opacity:.8}:host::ng-deep .asset-wrapper .asset-content__footer{display:flex;align-items:center;justify-content:space-between;padding:5px 8px}:host::ng-deep .asset-wrapper .asset-content__footer--info{max-width:calc(100% - 50px)}:host::ng-deep .asset-wrapper .asset-content__footer--info p{margin:0;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host::ng-deep .asset-wrapper .asset-content__footer--info .info{font-size:12px;color:#979797}:host::ng-deep .asset-wrapper .asset-content__footer--info .info .extension{text-transform:uppercase}:host::ng-deep .asset-wrapper .asset-content__footer--info.file-type__document{max-width:calc(100% - 70px)}:host::ng-deep .asset-wrapper .asset-content__footer--file-type{border-radius:5px;background-color:#d8d8d8;padding:2px 6px;font-size:12px}:host::ng-deep .asset-wrapper .asset-content:hover .edit-button{opacity:1!important}"]
|
|
4842
4860
|
}] }
|
|
4843
4861
|
];
|
|
4844
4862
|
/** @nocollapse */
|
|
@@ -4850,6 +4868,7 @@
|
|
|
4850
4868
|
{ type: core.ChangeDetectorRef }
|
|
4851
4869
|
]; };
|
|
4852
4870
|
AssetItemComponent.propDecorators = {
|
|
4871
|
+
isDialog: [{ type: core.Input }],
|
|
4853
4872
|
hasModifyPermission: [{ type: core.Input }],
|
|
4854
4873
|
hasAccessPermission: [{ type: core.Input }],
|
|
4855
4874
|
hasArchivePermission: [{ type: core.Input }],
|
|
@@ -4859,6 +4878,8 @@
|
|
|
4859
4878
|
return AssetItemComponent;
|
|
4860
4879
|
}());
|
|
4861
4880
|
if (false) {
|
|
4881
|
+
/** @type {?} */
|
|
4882
|
+
AssetItemComponent.prototype.isDialog;
|
|
4862
4883
|
/** @type {?} */
|
|
4863
4884
|
AssetItemComponent.prototype.hasModifyPermission;
|
|
4864
4885
|
/** @type {?} */
|
|
@@ -5082,14 +5103,16 @@
|
|
|
5082
5103
|
/**
|
|
5083
5104
|
* Reload the node, remove from display list
|
|
5084
5105
|
* @param {?} node
|
|
5106
|
+
* @param {?=} pageSize
|
|
5085
5107
|
* @return {?}
|
|
5086
5108
|
*/
|
|
5087
5109
|
NodeTreeDataSource.prototype.reloadNode = /**
|
|
5088
5110
|
* Reload the node, remove from display list
|
|
5089
5111
|
* @param {?} node
|
|
5112
|
+
* @param {?=} pageSize
|
|
5090
5113
|
* @return {?}
|
|
5091
5114
|
*/
|
|
5092
|
-
function (node) {
|
|
5115
|
+
function (node, pageSize) {
|
|
5093
5116
|
return __awaiter(this, void 0, void 0, function () {
|
|
5094
5117
|
var _a, newNode, index, count, i, nodes;
|
|
5095
5118
|
var _this = this;
|
|
@@ -5099,7 +5122,7 @@
|
|
|
5099
5122
|
if (!node) {
|
|
5100
5123
|
return [2 /*return*/];
|
|
5101
5124
|
}
|
|
5102
|
-
return [4 /*yield*/, this._database.getChildren(node.item)];
|
|
5125
|
+
return [4 /*yield*/, this._database.getChildren(node.item, pageSize)];
|
|
5103
5126
|
case 1:
|
|
5104
5127
|
newNode = _b.sent();
|
|
5105
5128
|
index = this.data.indexOf(node);
|
|
@@ -5194,7 +5217,7 @@
|
|
|
5194
5217
|
var rootFolder = this.folderChildrenMap.get(ROOT_ASSET_ID);
|
|
5195
5218
|
return {
|
|
5196
5219
|
length: rootFolder ? rootFolder.size : 0,
|
|
5197
|
-
total: this.nodeTreeService.rootFolder ? this.nodeTreeService.rootFolder.TotalFolder ||
|
|
5220
|
+
total: this.nodeTreeService.rootFolder ? this.nodeTreeService.rootFolder.TotalFolder || "0" : 0,
|
|
5198
5221
|
};
|
|
5199
5222
|
},
|
|
5200
5223
|
enumerable: true,
|
|
@@ -5267,9 +5290,7 @@
|
|
|
5267
5290
|
*/
|
|
5268
5291
|
function () {
|
|
5269
5292
|
var _this = this;
|
|
5270
|
-
this.nodeTreeService.loading$
|
|
5271
|
-
.pipe(operators.takeUntil(this.unsubscribe$), operators.distinctUntilChanged())
|
|
5272
|
-
.subscribe((/**
|
|
5293
|
+
this.nodeTreeService.loading$.pipe(operators.takeUntil(this.unsubscribe$), operators.distinctUntilChanged()).subscribe((/**
|
|
5273
5294
|
* @param {?} loading
|
|
5274
5295
|
* @return {?}
|
|
5275
5296
|
*/
|
|
@@ -5277,9 +5298,7 @@
|
|
|
5277
5298
|
_this.homeLoading = loading;
|
|
5278
5299
|
_this.changeDetectorRef.detectChanges();
|
|
5279
5300
|
}));
|
|
5280
|
-
this.nodeTreeService.initialData$
|
|
5281
|
-
.pipe(operators.takeUntil(this.unsubscribe$), operators.distinctUntilChanged())
|
|
5282
|
-
.subscribe((/**
|
|
5301
|
+
this.nodeTreeService.initialData$.pipe(operators.takeUntil(this.unsubscribe$), operators.distinctUntilChanged()).subscribe((/**
|
|
5283
5302
|
* @param {?} data
|
|
5284
5303
|
* @return {?}
|
|
5285
5304
|
*/
|
|
@@ -5294,9 +5313,7 @@
|
|
|
5294
5313
|
function (node) { return _this.nodeTreeService.addNode(node.item, null); }));
|
|
5295
5314
|
_this.changeDetectorRef.detectChanges();
|
|
5296
5315
|
}));
|
|
5297
|
-
this.dataSource.dataChange
|
|
5298
|
-
.pipe(operators.takeUntil(this.unsubscribe$))
|
|
5299
|
-
.subscribe((/**
|
|
5316
|
+
this.dataSource.dataChange.pipe(operators.takeUntil(this.unsubscribe$)).subscribe((/**
|
|
5300
5317
|
* @param {?} data
|
|
5301
5318
|
* @return {?}
|
|
5302
5319
|
*/
|
|
@@ -5467,11 +5484,13 @@
|
|
|
5467
5484
|
this.setLoadingMore(id, true);
|
|
5468
5485
|
children = this.folderChildrenMap.get(id);
|
|
5469
5486
|
itemsPerPage = this.assetService.AMConfig.pageFolderSize || MAX_FOLDER_TREE_SIZE;
|
|
5470
|
-
return [4 /*yield*/, this.assetService
|
|
5487
|
+
return [4 /*yield*/, this.assetService
|
|
5488
|
+
.getChildrenFolders({
|
|
5471
5489
|
assetId: id === ROOT_ASSET_ID ? null : id,
|
|
5472
5490
|
isFilter: false,
|
|
5473
|
-
pageIndex: Math.round((children ? children.size : 0) / itemsPerPage)
|
|
5474
|
-
})
|
|
5491
|
+
pageIndex: Math.round((children ? children.size : 0) / itemsPerPage),
|
|
5492
|
+
})
|
|
5493
|
+
.toPromise()];
|
|
5475
5494
|
case 2:
|
|
5476
5495
|
result = _a.sent();
|
|
5477
5496
|
assetChildren = result.Data.Children || [];
|
|
@@ -5498,7 +5517,7 @@
|
|
|
5498
5517
|
return [3 /*break*/, 4];
|
|
5499
5518
|
case 3:
|
|
5500
5519
|
error_1 = _a.sent();
|
|
5501
|
-
console.log(
|
|
5520
|
+
console.log("Load more folder error", error_1);
|
|
5502
5521
|
this.setLoadingMore(id, false);
|
|
5503
5522
|
return [3 /*break*/, 4];
|
|
5504
5523
|
case 4: return [2 /*return*/];
|
|
@@ -5579,7 +5598,7 @@
|
|
|
5579
5598
|
*/
|
|
5580
5599
|
function (id) {
|
|
5581
5600
|
return __awaiter(this, void 0, void 0, function () {
|
|
5582
|
-
var node, parent_1, updatedNode;
|
|
5601
|
+
var node, parent_1, children, updatedNode, rootFolder, updatedNode;
|
|
5583
5602
|
return __generator(this, function (_a) {
|
|
5584
5603
|
switch (_a.label) {
|
|
5585
5604
|
case 0:
|
|
@@ -5588,30 +5607,45 @@
|
|
|
5588
5607
|
}
|
|
5589
5608
|
this.loading = true;
|
|
5590
5609
|
node = this.getNodeById(id);
|
|
5591
|
-
if (!node) return [3 /*break*/,
|
|
5610
|
+
if (!node) return [3 /*break*/, 8];
|
|
5592
5611
|
parent_1 = this.getParent(node);
|
|
5593
5612
|
if (!parent_1) return [3 /*break*/, 4];
|
|
5594
5613
|
// Reload parent folder (get children and expand it again)
|
|
5595
|
-
|
|
5614
|
+
children = this.folderChildrenMap.get(parent_1.item.AssetId);
|
|
5615
|
+
return [4 /*yield*/, this.dataSource.reloadNode(parent_1, children.size)];
|
|
5596
5616
|
case 1:
|
|
5597
|
-
// Reload parent folder (get children and expand it again)
|
|
5598
5617
|
_a.sent();
|
|
5599
5618
|
updatedNode = this.getNodeById(id);
|
|
5600
5619
|
if (!updatedNode) return [3 /*break*/, 3];
|
|
5620
|
+
// TODO
|
|
5601
5621
|
return [4 /*yield*/, this.treeControl.expand(updatedNode)];
|
|
5602
5622
|
case 2:
|
|
5623
|
+
// TODO
|
|
5603
5624
|
_a.sent();
|
|
5604
5625
|
_a.label = 3;
|
|
5605
|
-
case 3: return [3 /*break*/,
|
|
5606
|
-
case 4:
|
|
5607
|
-
|
|
5626
|
+
case 3: return [3 /*break*/, 7];
|
|
5627
|
+
case 4:
|
|
5628
|
+
rootFolder = this.folderChildrenMap.get(ROOT_ASSET_ID);
|
|
5629
|
+
return [4 /*yield*/, this.nodeTreeService.initialData({ dispatchRootId: false, pageSize: rootFolder.size })];
|
|
5630
|
+
case 5:
|
|
5631
|
+
_a.sent();
|
|
5632
|
+
updatedNode = this.getNodeById(id);
|
|
5633
|
+
if (!updatedNode) return [3 /*break*/, 7];
|
|
5634
|
+
// TODO
|
|
5635
|
+
return [4 /*yield*/, this.treeControl.expand(updatedNode)];
|
|
5636
|
+
case 6:
|
|
5637
|
+
// TODO
|
|
5638
|
+
_a.sent();
|
|
5639
|
+
_a.label = 7;
|
|
5640
|
+
case 7: return [3 /*break*/, 10];
|
|
5641
|
+
case 8:
|
|
5608
5642
|
// Reload root folder
|
|
5609
5643
|
return [4 /*yield*/, this.nodeTreeService.initialData({ dispatchRootId: false })];
|
|
5610
|
-
case
|
|
5644
|
+
case 9:
|
|
5611
5645
|
// Reload root folder
|
|
5612
5646
|
_a.sent();
|
|
5613
|
-
_a.label =
|
|
5614
|
-
case
|
|
5647
|
+
_a.label = 10;
|
|
5648
|
+
case 10:
|
|
5615
5649
|
this.loading = false;
|
|
5616
5650
|
return [2 /*return*/];
|
|
5617
5651
|
}
|
|
@@ -5647,9 +5681,9 @@
|
|
|
5647
5681
|
};
|
|
5648
5682
|
NodeTreeComponent.decorators = [
|
|
5649
5683
|
{ type: core.Component, args: [{
|
|
5650
|
-
selector:
|
|
5684
|
+
selector: "lib-node-tree",
|
|
5651
5685
|
template: "<div class=\"node custom-scrollbar node-tree\">\n <div class=\"node__home\" (click)=\"backToHome()\" [ngClass]=\"{ active: isRoot,\n disabled: loading || homeLoading}\">\n <mat-icon *ngIf=\"!homeLoading\">home</mat-icon>\n <mat-spinner *ngIf=\"homeLoading\" [diameter]=\"20\"\n class=\"node__home--loading\"></mat-spinner>\n <span>Home</span>\n </div>\n <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\"\n class=\"node__item\">\n <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding\n [ngClass]=\"{ active: checked(node),disabled: loading || node.isLoading }\"\n (click)=\"selectNode(node)\">\n <button mat-icon-button disabled class=\"node__item--pading\"></button>\n <div class=\"node__item--info\" [style.maxWidth.px]=\"width -50\">\n <mat-icon class=\"folder-icon\">folder</mat-icon>\n <div class=\"node-name\">\n <span>\n {{ node.item.OriginalFileName }}\n </span>\n <span class=\"node-summary\" *ngIf=\"node.item?.TotalFolder ||\n node.item?.TotalFile\">\n <small *ngIf=\"node.item?.TotalFolder\">{{ node.item?.TotalFolder}}\n {{node.item?.TotalFolder> 1 ?\n 'folders':'folder'}}</small>\n <small *ngIf=\"node.item?.TotalFolder && node.item?.TotalFile\">,\n </small>\n <small *ngIf=\"node.item?.TotalFile\">{{ node.item?.TotalFile}}\n {{node.item?.TotalFile> 1 ?\n 'files':'file'}}</small>\n </span>\n </div>\n </div>\n </mat-tree-node>\n <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding \n [ngClass]=\"{ active: checked(node), disabled: loading || node.isLoading\n }\">\n <div class=\"d-flex align-items-center\" (click)=\"selectNode(node)\">\n <button mat-icon-button [attr.aria-label]=\"'Toggle ' +\n node.item.OriginalFileName\" matTreeNodeToggle\n [disabled]=\"node.isLoading\">\n <mat-icon *ngIf=\"!node.isLoading\" class=\"mat-icon-rtl-mirror\">\n {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\n </mat-icon>\n <mat-spinner *ngIf=\"node.isLoading\" [diameter]=\"20\"\n class=\"node__item--loading\"></mat-spinner>\n </button>\n <div class=\"node__item--info\" [style.maxWidth.px]=\"width -50\">\n <mat-icon class=\"folder-icon\">folder</mat-icon>\n <div class=\"node-name\">\n <span>\n {{ node.item.OriginalFileName }}\n </span>\n <span class=\"node-summary\">\n <small *ngIf=\"node.item?.TotalFolder\"><ng-container *ngIf=\"treeControl.isExpanded(node)\"><b>{{getFolderChildrenSize(node.item.AssetId)}}</b>/</ng-container>{{ node.item?.TotalFolder}}\n {{node.item?.TotalFolder> 1 ?\n 'folders':'folder'}}</small>\n <small *ngIf=\"node.item?.TotalFolder && node.item?.TotalFile\">,\n </small>\n <small *ngIf=\"node.item?.TotalFile\">{{ node.item?.TotalFile}}\n {{node.item?.TotalFile> 1 ?\n 'files':'file'}}</small>\n </span>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"treeControl.isExpanded(node)\"> \n <div *ngIf=\"!!loadingMoreList[node.item.AssetId]\" class=\"mx-2\" [style.minWidth.px]=\"40\">\n <mat-spinner [diameter]=\"20\"\n class=\"node__item--loading\"></mat-spinner>\n </div>\n <button *ngIf=\"!loadingMoreList[node.item.AssetId] && canLoadMore(node)\" matTooltip=\"Load More\" class=\"mx-2\" mat-icon-button (click)=\"loadMoreFolder(node)\" [disabled]=\"loadingMoreList[node.item.AssetId] || homeLoading || loading\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\"><path d=\"m482-200 114-113-114-113-42 42 43 43q-28 1-54.5-9T381-381q-20-20-30.5-46T340-479q0-17 4.5-34t12.5-33l-44-44q-17 25-25 53t-8 57q0 38 15 75t44 66q29 29 65 43.5t74 15.5l-38 38 42 42Zm165-170q17-25 25-53t8-57q0-38-14.5-75.5T622-622q-29-29-65.5-43T482-679l38-39-42-42-114 113 114 113 42-42-44-44q27 0 55 10.5t48 30.5q20 20 30.5 46t10.5 52q0 17-4.5 34T603-414l44 44ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z\"/></svg>\n </button>\n </ng-container>\n </mat-tree-node>\n </mat-tree>\n <div class=\"p-2 d-flex flex-column align-items-center justify-content-center\" *ngIf=\"folderTreeMeta.length\">\n <button mat-raised-button *ngIf=\"folderTreeMeta.length !== folderTreeMeta.total\" (click)=\"loadMoreFolder()\" [disabled]=\"loadingMoreList[ROOT_ASSET_ID] || loading || homeLoading\">\n <div class=\"d-flex align-items-center\">\n <mat-spinner [diameter]=\"20\" *ngIf=\"loadingMoreList[ROOT_ASSET_ID]\"></mat-spinner>\n <mat-icon *ngIf=\"!loadingMoreList[ROOT_ASSET_ID]\">expand_more</mat-icon>\n <div class=\"ml-2\">Load More</div>\n </div>\n </button>\n <div class=\"mt-2\" [style.fontSize.px]=\"13\"><b>{{ folderTreeMeta.length }}</b> of <b>{{ folderTreeMeta.total }} folders</b></div>\n </div>\n</div>",
|
|
5652
|
-
styles: [":host::ng-deep .node{overflow-x:hidden;height:100%;display
|
|
5686
|
+
styles: [":host::ng-deep .node{overflow-x:hidden;height:100%;display:grid;grid-auto-rows:max-content}:host::ng-deep .node-tree{max-height:max(800px,90vh);overflow-y:auto}:host::ng-deep .node__home{padding:8px 10px;display:flex;align-items:center;height:44px}:host::ng-deep .node__home .mat-icon{color:#979797;margin-right:15px;margin-bottom:10px;font-size:32px}:host::ng-deep .node__home .node__home--loading{margin-right:19px}:host::ng-deep .node__item--loading{margin-left:10px}:host::ng-deep .node__item--info{display:flex;align-items:center}:host::ng-deep .node__item--info .folder-icon{display:flex;align-items:center;color:#6fc0ff;font-size:32px;margin-right:20px}:host::ng-deep .node__item--info .node-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host::ng-deep .node__item--info .node-name span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host::ng-deep .node__item--info .node-name .node-summary{margin-top:-5px;color:#979797}:host::ng-deep .node .mat-tree{width:-moz-max-content!important;width:max-content!important;min-width:100%}:host::ng-deep .node .mat-tree .mat-tree-node{padding:5px 0;min-height:44px}:host::ng-deep .node .mat-tree .mat-tree-node .node__item--pading{height:20px}:host::ng-deep .node .mat-tree-node:hover,:host::ng-deep .node .node__home{transition:.3s;cursor:pointer}:host::ng-deep .node .mat-tree-node:hover:hover,:host::ng-deep .node .node__home:hover{background-color:#e8e8e8}:host::ng-deep .node .active{background-color:#f0f0f0}:host::ng-deep .node .disabled{pointer-events:none}"]
|
|
5653
5687
|
}] }
|
|
5654
5688
|
];
|
|
5655
5689
|
/** @nocollapse */
|
|
@@ -5963,11 +5997,16 @@
|
|
|
5963
5997
|
* @return {?}
|
|
5964
5998
|
*/
|
|
5965
5999
|
function (_a) {
|
|
5966
|
-
var _b = __read(_a, 2), folders = _b[0],
|
|
6000
|
+
var _b = __read(_a, 2), folders = _b[0], assetsRes = _b[1];
|
|
6001
|
+
/** @type {?} */
|
|
6002
|
+
var pagination = assetsRes && assetsRes.Meta || {};
|
|
6003
|
+
/** @type {?} */
|
|
6004
|
+
var assets = assetsRes && assetsRes.Data && assetsRes.Data.Children || [];
|
|
6005
|
+
/** @type {?} */
|
|
6006
|
+
var totalFile = assetsRes && assetsRes.Data && assetsRes.Data.TotalFile || 0;
|
|
5967
6007
|
_this.assetService.setFolderList(folders.Data, { Total: folders.Data.TotalFolder });
|
|
5968
|
-
_this.assetService.setAssetList(assets
|
|
5969
|
-
}))
|
|
5970
|
-
.add((/**
|
|
6008
|
+
_this.assetService.setAssetList(assets, pagination, totalFile);
|
|
6009
|
+
})).add((/**
|
|
5971
6010
|
* @return {?}
|
|
5972
6011
|
*/
|
|
5973
6012
|
function () {
|
|
@@ -6199,7 +6238,7 @@
|
|
|
6199
6238
|
AssetWrapperComponent.decorators = [
|
|
6200
6239
|
{ type: core.Component, args: [{
|
|
6201
6240
|
selector: 'lib-asset-wrapper',
|
|
6202
|
-
template: "<div class=\"asset-wrapper\">\n <div class=\"asset-header\" *ngIf=\"header\">\n <div class=\"asset-header__left asset-header__title\" #title>\n <lib-breadcrumb></lib-breadcrumb>\n </div>\n <div class=\"asset-header__right asset-header__actions\" #actions>\n <lib-search-box></lib-search-box>\n </div>\n </div>\n <div class=\"asset-body\">\n <lib-drag-to-resize (resizeCompleted)=\"onResize($event)\" class=\"asset-body__node-tree\" [minWidth]=\"nodeTreeMinWidth\" [maxWidth]=\"nodeTreeMaxWidth\">\n <lib-node-tree [width]=\"nodeTreeWidth\"></lib-node-tree>\n </lib-drag-to-resize>\n <lib-node-details \n class=\"asset-body__node-details\"
|
|
6241
|
+
template: "<div class=\"asset-wrapper\">\n <div class=\"asset-header\" *ngIf=\"header\">\n <div class=\"asset-header__left asset-header__title\" #title>\n <lib-breadcrumb></lib-breadcrumb>\n </div>\n <div class=\"asset-header__right asset-header__actions\" #actions>\n <lib-search-box></lib-search-box>\n </div>\n </div>\n <div class=\"asset-body\">\n <lib-drag-to-resize (resizeCompleted)=\"onResize($event)\" class=\"asset-body__node-tree\" [minWidth]=\"nodeTreeMinWidth\" [maxWidth]=\"nodeTreeMaxWidth\">\n <lib-node-tree [width]=\"nodeTreeWidth\"></lib-node-tree>\n </lib-drag-to-resize>\n <lib-node-details \n class=\"asset-body__node-details\"\n [isDialog]=\"isDialog\"\n [style.maxWidth]=\"nodeDetailsWidth\"\n [hasModifyPermission]=\"hasModifyPermission\"\n [hasAccessPermission]=\"hasAccessPermission\"\n [hasArchivePermission]=\"hasArchivePermission\"\n ></lib-node-details>\n </div>\n</div>",
|
|
6203
6242
|
styles: [":host::ng-deep .mat-dialog-title{padding:24px}:host::ng-deep .mat-dialog-title .lib-modal--close{padding:10px;position:absolute;top:10px;right:10px;z-index:1}:host::ng-deep .mat-dialog-actions{padding-left:24px;padding-right:24px}:host::ng-deep .asset-wrapper{display:flex;flex-direction:column;height:100%;width:100%;overflow-x:hidden}:host::ng-deep .asset-wrapper .asset-header{display:flex;padding:20px 15px;border-bottom:1px solid #d8d8d8;justify-content:space-between;align-items:center}:host::ng-deep .asset-wrapper .asset-body{display:flex;align-items:stretch}:host::ng-deep .asset-wrapper .asset-body__node-tree{border-right:1px solid #d8d8d8}:host::ng-deep .asset-wrapper .asset-body__node-details{flex:1}@media screen and (max-width:768px){:host::ng-deep .asset-wrapper .asset-header{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:10px}:host::ng-deep .asset-wrapper .asset-body{flex-direction:column;justify-content:flex-start}:host::ng-deep .asset-wrapper .asset-body__node-tree{width:100%}:host::ng-deep .asset-wrapper .asset-body__node-details{max-width:100%!important}}::ng-deep .mat-tooltip.width-auto{max-width:100%!important}"]
|
|
6204
6243
|
}] }
|
|
6205
6244
|
];
|
|
@@ -6209,6 +6248,7 @@
|
|
|
6209
6248
|
]; };
|
|
6210
6249
|
AssetWrapperComponent.propDecorators = {
|
|
6211
6250
|
header: [{ type: core.Input }],
|
|
6251
|
+
isDialog: [{ type: core.Input }],
|
|
6212
6252
|
hasModifyPermission: [{ type: core.Input }],
|
|
6213
6253
|
hasAccessPermission: [{ type: core.Input }],
|
|
6214
6254
|
hasArchivePermission: [{ type: core.Input }],
|
|
@@ -6220,6 +6260,8 @@
|
|
|
6220
6260
|
/** @type {?} */
|
|
6221
6261
|
AssetWrapperComponent.prototype.header;
|
|
6222
6262
|
/** @type {?} */
|
|
6263
|
+
AssetWrapperComponent.prototype.isDialog;
|
|
6264
|
+
/** @type {?} */
|
|
6223
6265
|
AssetWrapperComponent.prototype.hasModifyPermission;
|
|
6224
6266
|
/** @type {?} */
|
|
6225
6267
|
AssetWrapperComponent.prototype.hasAccessPermission;
|
|
@@ -6591,8 +6633,14 @@
|
|
|
6591
6633
|
*/
|
|
6592
6634
|
function (_a) {
|
|
6593
6635
|
var _b = __read(_a, 2), foldersRes = _b[0], assetsRes = _b[1];
|
|
6636
|
+
/** @type {?} */
|
|
6637
|
+
var pagination = assetsRes && assetsRes.Meta || {};
|
|
6638
|
+
/** @type {?} */
|
|
6639
|
+
var assets = assetsRes && assetsRes.Data && assetsRes.Data.Children || [];
|
|
6640
|
+
/** @type {?} */
|
|
6641
|
+
var totalFile = assetsRes && assetsRes.Data && assetsRes.Data.TotalFile || 0;
|
|
6594
6642
|
_this.setFolderList(foldersRes);
|
|
6595
|
-
_this.assetService.setAssetList(
|
|
6643
|
+
_this.assetService.setAssetList(assets, pagination, totalFile);
|
|
6596
6644
|
if (foldersRes.Data && foldersRes.Data.Children) {
|
|
6597
6645
|
foldersRes.Data.Children.forEach((/**
|
|
6598
6646
|
* @param {?} node
|
|
@@ -6692,8 +6740,8 @@
|
|
|
6692
6740
|
NodeDetailsComponent.decorators = [
|
|
6693
6741
|
{ type: core.Component, args: [{
|
|
6694
6742
|
selector: 'lib-node-details',
|
|
6695
|
-
template: "<div class=\"node-details custom-scrollbar\">\n <div class=\"node-header\">\n <mat-progress-bar [style.visibility]=\"(loading$ | async) ? 'visible' : 'hidden'\" mode=\"indeterminate\">\n </mat-progress-bar>\n <div class=\"node-header-content\">\n <div class=\"node-header-content__left\">\n <H5 class=\"node-header-content__left--title\">\n <ng-container *ngIf=\"assetService?.keyword\">\n Search results for <span>{{ assetService?.keyword }}</span> in\n </ng-container>\n {{ currentFolder?.OriginalFileName }}\n </H5>\n <p *ngIf=\"!noResults\" class=\"node-header-content__left--subtitle\">\n {{ assetService?.folderTotal }}\n {{ assetService?.folderTotal > 1 ? 'folders' : 'folder' }},\n {{ assetService?.fileTotal }}\n {{ assetService?.fileTotal > 1 ? 'files': 'file' }}\n </p>\n </div>\n <div class=\"node-header-content__right\">\n <div class=\"button-wrapper\">\n <button mat-raised-button [disabled]=\"!selectedAssets?.length || !hasArchivePermission\" (click)=\"deleteAssets()\" color=\"warn\">\n <span>{{selectedAssets?.length > 1 ? 'Delete assets' : 'Delete asset'}}</span>\n <span *ngIf=\"selectedAssets?.length\" class=\"count\">({{ selectedAssets.length }})</span>\n </button>\n <button mat-raised-button color=\"primary\" (click)=\"openUploadDialog()\" [disabled]=\"!currentFolder?.AssetId || !hasModifyPermission\">\n Upload asset\n </button>\n <button mat-raised-button color=\"primary\" (click)=\"addFolder()\" [disabled]=\"!currentFolder?.AssetId || !hasModifyPermission\">\n Add folder\n </button>\n </div>\n </div>\n </div>\n </div>\n <div class=\"node-body\">\n <lib-search-not-found *ngIf=\"noResults; else contentAsset\"></lib-search-not-found>\n <ng-template #contentAsset>\n <lib-folder-list\n class=\"node-body__section\"\n [folders]=\"currentFolder?.Children\"\n [pagination]=\"folderPagination\"\n [hasModifyPermission]=\"hasModifyPermission\"\n [hasAccessPermission]=\"hasAccessPermission\"\n [hasArchivePermission]=\"hasArchivePermission\"\n (onPageChange)=\"onFolderPageChange($event)\"\n ></lib-folder-list>\n <lib-asset-list\n [assets]=\"assets\"\n [hasModifyPermission]=\"hasModifyPermission\"\n [hasAccessPermission]=\"hasAccessPermission\"\n [hasArchivePermission]=\"hasArchivePermission\"\n ></lib-asset-list>\n </ng-template>\n </div>\n</div>",
|
|
6696
|
-
styles: [":host::ng-deep .node-details{max-height:100%;overflow-y:auto}:host::ng-deep .node-details .node-header{position
|
|
6743
|
+
template: "<div class=\"node-details custom-scrollbar\">\n <div class=\"node-header\">\n <mat-progress-bar [style.visibility]=\"(loading$ | async) ? 'visible' : 'hidden'\" mode=\"indeterminate\">\n </mat-progress-bar>\n <div class=\"node-header-content\">\n <div class=\"node-header-content__left\">\n <H5 class=\"node-header-content__left--title\">\n <ng-container *ngIf=\"assetService?.keyword\">\n Search results for <span>{{ assetService?.keyword }}</span> in\n </ng-container>\n {{ currentFolder?.OriginalFileName }}\n </H5>\n <p *ngIf=\"!noResults\" class=\"node-header-content__left--subtitle\">\n {{ assetService?.folderTotal }}\n {{ assetService?.folderTotal > 1 ? 'folders' : 'folder' }},\n {{ assetService?.fileTotal }}\n {{ assetService?.fileTotal > 1 ? 'files': 'file' }}\n </p>\n </div>\n <div class=\"node-header-content__right\">\n <div class=\"button-wrapper\">\n <button mat-raised-button [disabled]=\"!selectedAssets?.length || !hasArchivePermission\" (click)=\"deleteAssets()\" color=\"warn\">\n <span>{{selectedAssets?.length > 1 ? 'Delete assets' : 'Delete asset'}}</span>\n <span *ngIf=\"selectedAssets?.length\" class=\"count\">({{ selectedAssets.length }})</span>\n </button>\n <button mat-raised-button color=\"primary\" (click)=\"openUploadDialog()\" [disabled]=\"!currentFolder?.AssetId || !hasModifyPermission\">\n Upload asset\n </button>\n <button mat-raised-button color=\"primary\" (click)=\"addFolder()\" [disabled]=\"!currentFolder?.AssetId || !hasModifyPermission\">\n Add folder\n </button>\n </div>\n </div>\n </div>\n </div>\n <div class=\"node-body\">\n <lib-search-not-found *ngIf=\"noResults; else contentAsset\"></lib-search-not-found>\n <ng-template #contentAsset>\n <lib-folder-list\n class=\"node-body__section\"\n [folders]=\"currentFolder?.Children\"\n [pagination]=\"folderPagination\"\n [hasModifyPermission]=\"hasModifyPermission\"\n [hasAccessPermission]=\"hasAccessPermission\"\n [hasArchivePermission]=\"hasArchivePermission\"\n (onPageChange)=\"onFolderPageChange($event)\"\n ></lib-folder-list>\n <lib-asset-list\n [assets]=\"assets\"\n [isDialog]=\"isDialog\"\n [hasModifyPermission]=\"hasModifyPermission\"\n [hasAccessPermission]=\"hasAccessPermission\"\n [hasArchivePermission]=\"hasArchivePermission\"\n ></lib-asset-list>\n </ng-template>\n </div>\n</div>",
|
|
6744
|
+
styles: [":host::ng-deep .node-details{max-height:100%;overflow-y:auto}:host::ng-deep .node-details .node-header{position:sticky;top:0;background-color:#fff;z-index:20}:host::ng-deep .node-details .node-header-content{padding:10px 20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}:host::ng-deep .node-details .node-header-content__left--title{margin-bottom:5px}:host::ng-deep .node-details .node-header-content__left--title span{color:#fb3458}:host::ng-deep .node-details .node-header-content__left--subtitle{margin:0;color:#979797;font-size:14px}:host::ng-deep .node-details .node-header-content__right{flex:1}:host::ng-deep .node-details .node-header-content__right .button-wrapper{display:flex;gap:15px;justify-content:flex-end}:host::ng-deep .node-details .node-header-content__right .button-wrapper .count{margin-left:3px}:host::ng-deep .node-details .node-body{padding:0 20px}:host::ng-deep .node-details .node-body__section{display:block;margin-bottom:15px}"]
|
|
6697
6745
|
}] }
|
|
6698
6746
|
];
|
|
6699
6747
|
/** @nocollapse */
|
|
@@ -6705,6 +6753,7 @@
|
|
|
6705
6753
|
{ type: core.ChangeDetectorRef }
|
|
6706
6754
|
]; };
|
|
6707
6755
|
NodeDetailsComponent.propDecorators = {
|
|
6756
|
+
isDialog: [{ type: core.Input }],
|
|
6708
6757
|
hasModifyPermission: [{ type: core.Input }],
|
|
6709
6758
|
hasAccessPermission: [{ type: core.Input }],
|
|
6710
6759
|
hasArchivePermission: [{ type: core.Input }]
|
|
@@ -6712,6 +6761,8 @@
|
|
|
6712
6761
|
return NodeDetailsComponent;
|
|
6713
6762
|
}());
|
|
6714
6763
|
if (false) {
|
|
6764
|
+
/** @type {?} */
|
|
6765
|
+
NodeDetailsComponent.prototype.isDialog;
|
|
6715
6766
|
/** @type {?} */
|
|
6716
6767
|
NodeDetailsComponent.prototype.hasModifyPermission;
|
|
6717
6768
|
/** @type {?} */
|