@tuki-io/tuki-widgets 0.0.219-dev.43 → 0.0.219-dev.45
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/README.md +24 -24
- package/esm2020/contact-center/cc-readiness/cc-readiness.module.mjs +1 -1
- package/esm2020/contact-center/cc-readiness/cc-readiness.service.mjs +1 -1
- package/esm2020/contact-center/cc-readiness/widgets/licences-requirement/licences-requirement.component.mjs +3 -3
- package/esm2020/di2mt/widgets/site-upgrade/progress-bar/progress-bar.component.mjs +3 -3
- package/esm2020/di2mt/widgets/site-upgrade/site-upgrade-data-table/site-upgrade-data-table.component.mjs +2 -2
- package/esm2020/di2mt/widgets/upgrade-overview/cards/pending-activation-users/pending-activation-users.component.mjs +17 -17
- package/esm2020/lib/widgets.component.mjs +9 -9
- package/esm2020/lib/widgets.module.mjs +1 -1
- package/esm2020/lib/widgets.service.mjs +1 -1
- package/esm2020/locations/public-api.mjs +1 -1
- package/esm2020/locations/src/app.constants.mjs +6 -2
- package/esm2020/locations/src/location-confirm-dialog/location-confirm-dialog.component.mjs +23 -0
- package/esm2020/locations/src/locations.component.mjs +90 -13
- package/esm2020/locations/src/locations.module.mjs +4 -1
- package/esm2020/locations/src/material.module.mjs +8 -1
- package/esm2020/locations/src/services/api.service.mjs +1 -1
- package/esm2020/locations/src/services/locations.service.mjs +11 -1
- package/esm2020/locations/src/types/location.mjs +1 -1
- package/esm2020/locations/src/utils/app-loader/app-loader.mjs +3 -3
- package/esm2020/meetings/src/app.constants.mjs +1 -1
- package/esm2020/meetings/src/components/live-meetings/live-meetings.component.mjs +3 -3
- package/esm2020/meetings/src/components/meeting-spaces/meeting-spaces.component.mjs +3 -3
- package/esm2020/meetings/src/meetings.component.mjs +3 -3
- package/esm2020/meetings/src/meetings.module.mjs +1 -1
- package/esm2020/meetings/src/services/live-meetings.service.mjs +1 -1
- package/esm2020/meetings/src/services/meeting-spaces.service.mjs +1 -1
- package/esm2020/meetings/src/types/live-meeting.mjs +1 -1
- package/esm2020/meetings/src/types/meeting-space.mjs +1 -1
- package/esm2020/meetings/src/utils/app-loader/app-loader.mjs +3 -3
- package/esm2020/public-api.mjs +1 -1
- package/esm2020/user-creation/src/app.constants.mjs +1 -1
- package/esm2020/user-creation/src/classes/notification.mjs +1 -1
- package/esm2020/user-creation/src/classes/site.mjs +1 -1
- package/esm2020/user-creation/src/environments/environment.mjs +1 -1
- package/esm2020/user-creation/src/interfaces/user-creation-wizard.interfaces.mjs +1 -1
- package/esm2020/user-creation/src/shared/components/notification/notification.component.mjs +3 -3
- package/esm2020/user-creation/src/shared/pipes/truncate.pipe.mjs +1 -1
- package/esm2020/user-creation/src/shared/services/notification.service.mjs +1 -1
- package/esm2020/user-creation/src/shared/services/user-creation-api.service.mjs +1 -1
- package/esm2020/user-creation/src/shared/services/utils.mjs +1 -1
- package/esm2020/user-creation/src/utils/app-loader/app-loader.mjs +3 -3
- package/esm2020/user-creation/src/utils/build-savable-end-user.mjs +1 -1
- package/esm2020/user-creation/src/utils/device-default-prefix.mjs +1 -1
- package/esm2020/user-creation/src/utils/device-name-dynamic-tokens.mjs +1 -1
- package/esm2020/user-creation/src/utils/device-name-validation.mjs +1 -1
- package/esm2020/user-creation/src/utils/model.mjs +1 -1
- package/esm2020/user-creation/src/utils/parse-device-name-rule.mjs +1 -1
- package/esm2020/user-creation/src/widgets/user-creation-wizard/user-creation-wizard.component.mjs +3 -3
- package/esm2020/user-device-manage/public-api.mjs +1 -1
- package/esm2020/user-device-manage/src/app.constants.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/device.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/deviceProfile.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/line-association-interface.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/line-association.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/line-call-info-display.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/line-directory.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/line.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/notification.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/recording-options.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/simplified-user.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/site-defaults.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/translation-pattern.mjs +1 -1
- package/esm2020/user-device-manage/src/classes/types.mjs +1 -1
- package/esm2020/user-device-manage/src/common-functions.mjs +1 -1
- package/esm2020/user-device-manage/src/confirm-dialog/info-dialog.component.mjs +3 -3
- package/esm2020/user-device-manage/src/device-associated-line/associated-line-row/associated-line-row.component.mjs +3 -3
- package/esm2020/user-device-manage/src/device-associated-line/device-associated-line-details-box/device-associated-line-details-box.component.mjs +3 -3
- package/esm2020/user-device-manage/src/device-associated-line/device-associated-line-extension/device-associated-line-extension.component.mjs +3 -3
- package/esm2020/user-device-manage/src/device-associated-line/device-associated-line.component.mjs +1 -1
- package/esm2020/user-device-manage/src/device-info/device-info.component.mjs +3 -3
- package/esm2020/user-device-manage/src/device-manage-widget.component.mjs +2 -2
- package/esm2020/user-device-manage/src/environments/environment.mjs +1 -1
- package/esm2020/user-device-manage/src/interseptors/auth.interceptor.mjs +1 -1
- package/esm2020/user-device-manage/src/lazy-loading-select/lazy-loading-select.component.mjs +3 -3
- package/esm2020/user-device-manage/src/material.module.mjs +1 -1
- package/esm2020/user-device-manage/src/notifications/notification.component.mjs +3 -3
- package/esm2020/user-device-manage/src/pipes/mac-address.pipe.mjs +1 -1
- package/esm2020/user-device-manage/src/services/api.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/device.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/dns.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/line.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/notification.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/removeKynFromIBM.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/site-settings.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/sorting-utils.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/user.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/utils.service.mjs +1 -1
- package/esm2020/user-device-manage/src/services/validation.service.mjs +1 -1
- package/esm2020/user-device-manage/src/utils/app-loader/app-loader.mjs +3 -3
- package/esm2020/user-manage/public-api.mjs +1 -1
- package/esm2020/user-manage/src/app.constants.mjs +1 -1
- package/esm2020/user-manage/src/classes/device.mjs +1 -1
- package/esm2020/user-manage/src/classes/line-association-interface.mjs +1 -1
- package/esm2020/user-manage/src/classes/line-association.mjs +1 -1
- package/esm2020/user-manage/src/classes/line-call-info-display.mjs +1 -1
- package/esm2020/user-manage/src/classes/line-directory.mjs +1 -1
- package/esm2020/user-manage/src/classes/line.mjs +1 -1
- package/esm2020/user-manage/src/classes/notification.mjs +1 -1
- package/esm2020/user-manage/src/classes/pagination.mjs +1 -1
- package/esm2020/user-manage/src/classes/recording-options.mjs +1 -1
- package/esm2020/user-manage/src/classes/simplified-user.mjs +1 -1
- package/esm2020/user-manage/src/classes/table-data.mjs +1 -1
- package/esm2020/user-manage/src/classes/translation-pattern.mjs +1 -1
- package/esm2020/user-manage/src/classes/user-list.mjs +1 -1
- package/esm2020/user-manage/src/common-functions.mjs +1 -1
- package/esm2020/user-manage/src/device-list/device-list.component.mjs +3 -3
- package/esm2020/user-manage/src/device-list/device-row/device-row.component.mjs +3 -3
- package/esm2020/user-manage/src/environments/environment.mjs +1 -1
- package/esm2020/user-manage/src/interseptors/auth.interceptor.mjs +1 -1
- package/esm2020/user-manage/src/lazy-loading-select/lazy-loading-select.component.mjs +3 -3
- package/esm2020/user-manage/src/material.module.mjs +1 -1
- package/esm2020/user-manage/src/notifications/notification.component.mjs +3 -3
- package/esm2020/user-manage/src/removeKynFromIBM.service.mjs +1 -1
- package/esm2020/user-manage/src/services/api.service.mjs +1 -1
- package/esm2020/user-manage/src/services/dcp-api.service.mjs +1 -1
- package/esm2020/user-manage/src/services/dns.service.mjs +1 -1
- package/esm2020/user-manage/src/services/line.service.mjs +1 -1
- package/esm2020/user-manage/src/services/notification.service.mjs +1 -1
- package/esm2020/user-manage/src/services/removeKynFromIBM.service.mjs +1 -1
- package/esm2020/user-manage/src/services/site-settings.service.mjs +1 -1
- package/esm2020/user-manage/src/services/sorting-utils.service.mjs +1 -1
- package/esm2020/user-manage/src/services/user.service.mjs +1 -1
- package/esm2020/user-manage/src/services/utils.service.mjs +1 -1
- package/esm2020/user-manage/src/user-calling/user-calling-extension/user-calling-extension.component.mjs +3 -3
- package/esm2020/user-manage/src/user-info/user-info.component.mjs +3 -3
- package/esm2020/user-manage/src/user-manage-widget.component.mjs +2 -2
- package/esm2020/user-manage/src/user-manage.module.mjs +1 -1
- package/esm2020/user-manage/src/utils/app-loader/app-loader.mjs +3 -3
- package/esm2020/user-manage/src/utils/pagination/pagination.component.mjs +3 -3
- package/esm2020/users-list/public-api.mjs +1 -1
- package/esm2020/users-list/src/app.constants.mjs +1 -1
- package/esm2020/users-list/src/classes/app-location.mjs +1 -1
- package/esm2020/users-list/src/classes/device.mjs +1 -1
- package/esm2020/users-list/src/classes/line.mjs +1 -1
- package/esm2020/users-list/src/classes/move-user.mjs +1 -1
- package/esm2020/users-list/src/classes/notification.mjs +1 -1
- package/esm2020/users-list/src/classes/simlified-user.mjs +1 -1
- package/esm2020/users-list/src/classes/table-data.mjs +1 -1
- package/esm2020/users-list/src/classes/user-list.mjs +1 -1
- package/esm2020/users-list/src/move-user-wizard/move-user-stepper/device-move-user/device-move-user-wizard.component.mjs +3 -3
- package/esm2020/users-list/src/move-user-wizard/move-user-stepper/device-move-user-tab/devices-move-user-wizard-tab.component.mjs +3 -3
- package/esm2020/users-list/src/move-user-wizard/move-user-wizard.component.mjs +3 -3
- package/esm2020/users-list/src/services/api-webex.service.mjs +1 -1
- package/esm2020/users-list/src/services/api.service.mjs +1 -1
- package/esm2020/users-list/src/services/dns.service.mjs +1 -1
- package/esm2020/users-list/src/services/events-communication.service.mjs +1 -1
- package/esm2020/users-list/src/services/notification.service.mjs +1 -1
- package/esm2020/users-list/src/services/removeKynFromIBM.service.mjs +1 -1
- package/esm2020/users-list/src/services/site-settings.service.mjs +1 -1
- package/esm2020/users-list/src/services/user.service.mjs +1 -1
- package/esm2020/users-list/src/user-list-confirm-dialog/user-list-confirm-dialog.component.mjs +3 -3
- package/esm2020/users-list/src/utils/app-loader/app-loader.mjs +3 -3
- package/esm2020/users-list/src/utils/common-functions.mjs +1 -1
- package/esm2020/users-list/src/utils/notifications/notification.component.mjs +3 -3
- package/esm2020/users-list/src/utils/utils.service.mjs +1 -1
- package/esm2020/workspaces/public-api.mjs +1 -1
- package/esm2020/workspaces/src/app.constants.mjs +2 -2
- package/esm2020/workspaces/src/components/workspace-detail/workspace-detail.component.mjs +9 -3
- package/esm2020/workspaces/src/components/workspaces-filters/workspaces-filters.component.mjs +3 -3
- package/esm2020/workspaces/src/components/workspaces-table/workspaces-table.component.mjs +8 -5
- package/esm2020/workspaces/src/material.module.mjs +1 -1
- package/esm2020/workspaces/src/services/api.service.mjs +1 -1
- package/esm2020/workspaces/src/services/workspace-detail.service.mjs +1 -1
- package/esm2020/workspaces/src/services/workspaces-migration.service.mjs +3 -3
- package/esm2020/workspaces/src/services/workspaces.service.mjs +1 -1
- package/esm2020/workspaces/src/types/workspace.mjs +1 -1
- package/esm2020/workspaces/src/utils/app-loader/app-loader.mjs +3 -3
- package/esm2020/workspaces/src/utils/device-icon.mjs +1 -1
- package/esm2020/workspaces/src/workspaces.component.mjs +15 -13
- package/esm2020/workspaces/src/workspaces.module.mjs +1 -1
- package/fesm2015/tuki-io-tuki-widgets-contact-center.mjs +2 -2
- package/fesm2015/tuki-io-tuki-widgets-contact-center.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-di2mt.mjs +20 -20
- package/fesm2015/tuki-io-tuki-widgets-di2mt.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-locations.mjs +138 -19
- package/fesm2015/tuki-io-tuki-widgets-locations.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-meetings.mjs +8 -8
- package/fesm2015/tuki-io-tuki-widgets-meetings.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-user-creation.mjs +6 -6
- package/fesm2015/tuki-io-tuki-widgets-user-creation.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-user-device-manage.mjs +18 -18
- package/fesm2015/tuki-io-tuki-widgets-user-device-manage.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-user-manage.mjs +18 -18
- package/fesm2015/tuki-io-tuki-widgets-user-manage.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-users-list.mjs +12 -12
- package/fesm2015/tuki-io-tuki-widgets-users-list.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-workspaces.mjs +38 -27
- package/fesm2015/tuki-io-tuki-widgets-workspaces.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets.mjs +8 -8
- package/fesm2015/tuki-io-tuki-widgets.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-contact-center.mjs +2 -2
- package/fesm2020/tuki-io-tuki-widgets-contact-center.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-di2mt.mjs +20 -20
- package/fesm2020/tuki-io-tuki-widgets-di2mt.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-locations.mjs +136 -19
- package/fesm2020/tuki-io-tuki-widgets-locations.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-meetings.mjs +8 -8
- package/fesm2020/tuki-io-tuki-widgets-meetings.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-user-creation.mjs +6 -6
- package/fesm2020/tuki-io-tuki-widgets-user-creation.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-user-device-manage.mjs +18 -18
- package/fesm2020/tuki-io-tuki-widgets-user-device-manage.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-user-manage.mjs +18 -18
- package/fesm2020/tuki-io-tuki-widgets-user-manage.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-users-list.mjs +12 -12
- package/fesm2020/tuki-io-tuki-widgets-users-list.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-workspaces.mjs +36 -25
- package/fesm2020/tuki-io-tuki-widgets-workspaces.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets.mjs +8 -8
- package/fesm2020/tuki-io-tuki-widgets.mjs.map +1 -1
- package/locations/src/app.constants.d.ts +4 -0
- package/locations/src/location-confirm-dialog/location-confirm-dialog.component.d.ts +15 -0
- package/locations/src/locations.component.d.ts +12 -3
- package/locations/src/locations.module.d.ts +7 -6
- package/locations/src/material.module.d.ts +6 -5
- package/locations/src/services/locations.service.d.ts +8 -0
- package/locations/src/types/location.d.ts +2 -0
- package/package.json +1 -1
- package/workspaces/src/components/workspace-detail/workspace-detail.component.d.ts +3 -2
- package/workspaces/src/components/workspaces-table/workspaces-table.component.d.ts +4 -3
- package/workspaces/src/types/workspace.d.ts +5 -0
- package/workspaces/src/workspaces.component.d.ts +3 -2
|
@@ -202,7 +202,7 @@ const API = {
|
|
|
202
202
|
GET_ALL: '/api/search/quicknonuserdevices',
|
|
203
203
|
},
|
|
204
204
|
MIGRATION: {
|
|
205
|
-
MOVE: '/api/migration/webex/singlemigration/features/
|
|
205
|
+
MOVE: '/api/migration/webex/singlemigration/features/ORPHANED_DEVICE',
|
|
206
206
|
MIGRATION_FORM: '/api/search/webex/customers/:customerId/migrationforms/:formId',
|
|
207
207
|
MIGRATION_FORM_ENTITIES_MIGRATED: '/api/search/webex/customers/:customerId/migrationformentities/migrated',
|
|
208
208
|
TRIGGER_FIRMWARE_MIGRATION: '/api/migration/:migrationType/firmwaremigration/customer/:customerId/migration/:migrationFormId',
|
|
@@ -310,7 +310,7 @@ class WorkspacesMigrationService {
|
|
|
310
310
|
.replace(':formId', String(formId));
|
|
311
311
|
return this.apiWebexService.fetch(url);
|
|
312
312
|
}
|
|
313
|
-
getMigratedMigrationFormEntities(customerId, webexUUID, feature = '
|
|
313
|
+
getMigratedMigrationFormEntities(customerId, webexUUID, feature = 'ORPHANED_DEVICE') {
|
|
314
314
|
const url = API.MIGRATION.MIGRATION_FORM_ENTITIES_MIGRATED.replace(':customerId', String(customerId));
|
|
315
315
|
return this.apiWebexService.fetch(url, { webexUUID, feature });
|
|
316
316
|
}
|
|
@@ -338,7 +338,7 @@ class WorkspacesMigrationService {
|
|
|
338
338
|
return {
|
|
339
339
|
customerId,
|
|
340
340
|
entities: {
|
|
341
|
-
|
|
341
|
+
ORPHANED_DEVICE: [{ cucmId: device.cucmId, entityId: device.name }],
|
|
342
342
|
},
|
|
343
343
|
};
|
|
344
344
|
}
|
|
@@ -382,10 +382,10 @@ class WorkspacesFiltersComponent {
|
|
|
382
382
|
}
|
|
383
383
|
}
|
|
384
384
|
WorkspacesFiltersComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WorkspacesFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
385
|
-
WorkspacesFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WorkspacesFiltersComponent, selector: "tk-workspaces-filters", inputs: { resultCount: "resultCount", typeOptions: "typeOptions", locationOptions: "locationOptions" }, outputs: { searchChange: "searchChange", typeChange: "typeChange", locationChange: "locationChange", addWorkspace: "addWorkspace" }, ngImport: i0, template: "<div class=\"tk-workspaces-filters\">\n <div class=\"tk-workspaces-filters__search\">\n <input\n class=\"tk-workspaces-filters__search-input blue-input\"\n type=\"text\"\n placeholder=\"Search\"\n [value]=\"searchTerm\"\n (input)=\"onSearchInputChange($event)\"\n />\n <mat-icon class=\"tk-workspaces-filters__search-icon\">search</mat-icon>\n </div>\n\n <div class=\"tk-workspaces-filters__filters\">\n <span class=\"tk-workspaces-filters__filters-label\">Filters:</span>\n\n <div class=\"tk-workspaces-filters__select-wrap\">\n <select\n class=\"tk-workspaces-filters__select\"\n [ngModel]=\"selectedType\"\n (ngModelChange)=\"onTypeChange($event)\">\n <option value=\"\">General</option>\n <option *ngFor=\"let type of typeOptions\" [value]=\"type\">{{ type }}</option>\n </select>\n <mat-icon class=\"tk-workspaces-filters__select-icon\">expand_more</mat-icon>\n </div>\n\n <div class=\"tk-workspaces-filters__select-wrap\">\n <select\n class=\"tk-workspaces-filters__select\"\n [ngModel]=\"selectedLocation\"\n (ngModelChange)=\"onLocationChange($event)\">\n <option value=\"\">Location</option>\n <option *ngFor=\"let location of locationOptions\" [value]=\"location\">{{ location }}</option>\n </select>\n <mat-icon class=\"tk-workspaces-filters__select-icon\">expand_more</mat-icon>\n </div>\n </div>\n\n <span class=\"tk-workspaces-filters__count\">{{ resultCount }} workspace{{ resultCount === 1 ? '' : 's' }} in total</span>\n\n <button type=\"button\" class=\"tk-workspaces-filters__add-button\" [matMenuTriggerFor]=\"addMenu\">\n Add workspace\n <mat-icon class=\"tk-workspaces-filters__add-icon\">expand_more</mat-icon>\n </button>\n\n <mat-menu #addMenu=\"matMenu\">\n <button type=\"button\" mat-menu-item (click)=\"onAddWorkspace()\">Add workspace</button>\n <button type=\"button\" mat-menu-item disabled>Import workspaces</button>\n </mat-menu>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2}.tk-workspaces-filters{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap;font-size:.875rem;font-weight:400;color:#000000f2}.tk-workspaces-filters__search{position:relative;min-width:14rem}.tk-workspaces-filters__search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006;pointer-events:none}.tk-workspaces-filters__search-input{width:100%;height:34px;padding:6px 12px 6px 44px;border-radius:.5rem;outline:none;box-sizing:border-box;font-family:inherit;font-size:1rem;color:#000000f2;background:#fff}.tk-workspaces-filters__search-input::placeholder{color:#0006}.tk-workspaces-filters__filters{display:flex;align-items:center;gap:.5rem}.tk-workspaces-filters__filters-label{font-size:.875rem;color:#000000f2;white-space:nowrap}.tk-workspaces-filters__select-wrap{position:relative;display:flex;align-items:center}.tk-workspaces-filters__select{appearance:none;height:34px;padding:6px 32px 6px 12px;background:#fff;border:1px solid rgba(0,0,0,.5019607843);border-radius:.5rem;font-family:inherit;font-size:1rem;color:#222;cursor:pointer;box-sizing:border-box}.tk-workspaces-filters__select:focus{outline:none;border-color:#0006}.tk-workspaces-filters__select-icon{position:absolute;right:.375rem;font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006;pointer-events:none}.tk-workspaces-filters__count{margin-left:auto;font-size:.875rem;color:#0009;white-space:nowrap;font-weight:400;flex:1}.tk-workspaces-filters__add-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#000;color:#fff;border:none;border-radius:6.25rem;font-family:inherit;font-size:.8125rem;font-weight:500;cursor:pointer;white-space:nowrap}.tk-workspaces-filters__add-button:hover{background:#222}.tk-workspaces-filters__add-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] });
|
|
385
|
+
WorkspacesFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WorkspacesFiltersComponent, selector: "tk-workspaces-filters", inputs: { resultCount: "resultCount", typeOptions: "typeOptions", locationOptions: "locationOptions" }, outputs: { searchChange: "searchChange", typeChange: "typeChange", locationChange: "locationChange", addWorkspace: "addWorkspace" }, ngImport: i0, template: "<div class=\"tk-workspaces-filters\">\r\n <div class=\"tk-workspaces-filters__search\">\r\n <input\r\n class=\"tk-workspaces-filters__search-input blue-input\"\r\n type=\"text\"\r\n placeholder=\"Search\"\r\n [value]=\"searchTerm\"\r\n (input)=\"onSearchInputChange($event)\"\r\n />\r\n <mat-icon class=\"tk-workspaces-filters__search-icon\">search</mat-icon>\r\n </div>\r\n\r\n <div class=\"tk-workspaces-filters__filters\">\r\n <span class=\"tk-workspaces-filters__filters-label\">Filters:</span>\r\n\r\n <div class=\"tk-workspaces-filters__select-wrap\">\r\n <select\r\n class=\"tk-workspaces-filters__select\"\r\n [ngModel]=\"selectedType\"\r\n (ngModelChange)=\"onTypeChange($event)\">\r\n <option value=\"\">General</option>\r\n <option *ngFor=\"let type of typeOptions\" [value]=\"type\">{{ type }}</option>\r\n </select>\r\n <mat-icon class=\"tk-workspaces-filters__select-icon\">expand_more</mat-icon>\r\n </div>\r\n\r\n <div class=\"tk-workspaces-filters__select-wrap\">\r\n <select\r\n class=\"tk-workspaces-filters__select\"\r\n [ngModel]=\"selectedLocation\"\r\n (ngModelChange)=\"onLocationChange($event)\">\r\n <option value=\"\">Location</option>\r\n <option *ngFor=\"let location of locationOptions\" [value]=\"location\">{{ location }}</option>\r\n </select>\r\n <mat-icon class=\"tk-workspaces-filters__select-icon\">expand_more</mat-icon>\r\n </div>\r\n </div>\r\n\r\n <span class=\"tk-workspaces-filters__count\">{{ resultCount }} workspace{{ resultCount === 1 ? '' : 's' }} in total</span>\r\n\r\n <button type=\"button\" class=\"tk-workspaces-filters__add-button\" [matMenuTriggerFor]=\"addMenu\">\r\n Add workspace\r\n <mat-icon class=\"tk-workspaces-filters__add-icon\">expand_more</mat-icon>\r\n </button>\r\n\r\n <mat-menu #addMenu=\"matMenu\">\r\n <button type=\"button\" mat-menu-item (click)=\"onAddWorkspace()\">Add workspace</button>\r\n <button type=\"button\" mat-menu-item disabled>Import workspaces</button>\r\n </mat-menu>\r\n</div>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2}.tk-workspaces-filters{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap;font-size:.875rem;font-weight:400;color:#000000f2}.tk-workspaces-filters__search{position:relative;min-width:14rem}.tk-workspaces-filters__search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006;pointer-events:none}.tk-workspaces-filters__search-input{width:100%;height:34px;padding:6px 12px 6px 44px;border-radius:.5rem;outline:none;box-sizing:border-box;font-family:inherit;font-size:1rem;color:#000000f2;background:#fff}.tk-workspaces-filters__search-input::placeholder{color:#0006}.tk-workspaces-filters__filters{display:flex;align-items:center;gap:.5rem}.tk-workspaces-filters__filters-label{font-size:.875rem;color:#000000f2;white-space:nowrap}.tk-workspaces-filters__select-wrap{position:relative;display:flex;align-items:center}.tk-workspaces-filters__select{appearance:none;height:34px;padding:6px 32px 6px 12px;background:#fff;border:1px solid rgba(0,0,0,.5019607843);border-radius:.5rem;font-family:inherit;font-size:1rem;color:#222;cursor:pointer;box-sizing:border-box}.tk-workspaces-filters__select:focus{outline:none;border-color:#0006}.tk-workspaces-filters__select-icon{position:absolute;right:.375rem;font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006;pointer-events:none}.tk-workspaces-filters__count{margin-left:auto;font-size:.875rem;color:#0009;white-space:nowrap;font-weight:400;flex:1}.tk-workspaces-filters__add-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#000;color:#fff;border:none;border-radius:6.25rem;font-family:inherit;font-size:.8125rem;font-weight:500;cursor:pointer;white-space:nowrap}.tk-workspaces-filters__add-button:hover{background:#222}.tk-workspaces-filters__add-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] });
|
|
386
386
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WorkspacesFiltersComponent, decorators: [{
|
|
387
387
|
type: Component,
|
|
388
|
-
args: [{ selector: 'tk-workspaces-filters', template: "<div class=\"tk-workspaces-filters\">\n <div class=\"tk-workspaces-filters__search\">\n <input\n class=\"tk-workspaces-filters__search-input blue-input\"\n type=\"text\"\n placeholder=\"Search\"\n [value]=\"searchTerm\"\n (input)=\"onSearchInputChange($event)\"\n />\n <mat-icon class=\"tk-workspaces-filters__search-icon\">search</mat-icon>\n </div>\n\n <div class=\"tk-workspaces-filters__filters\">\n <span class=\"tk-workspaces-filters__filters-label\">Filters:</span>\n\n <div class=\"tk-workspaces-filters__select-wrap\">\n <select\n class=\"tk-workspaces-filters__select\"\n [ngModel]=\"selectedType\"\n (ngModelChange)=\"onTypeChange($event)\">\n <option value=\"\">General</option>\n <option *ngFor=\"let type of typeOptions\" [value]=\"type\">{{ type }}</option>\n </select>\n <mat-icon class=\"tk-workspaces-filters__select-icon\">expand_more</mat-icon>\n </div>\n\n <div class=\"tk-workspaces-filters__select-wrap\">\n <select\n class=\"tk-workspaces-filters__select\"\n [ngModel]=\"selectedLocation\"\n (ngModelChange)=\"onLocationChange($event)\">\n <option value=\"\">Location</option>\n <option *ngFor=\"let location of locationOptions\" [value]=\"location\">{{ location }}</option>\n </select>\n <mat-icon class=\"tk-workspaces-filters__select-icon\">expand_more</mat-icon>\n </div>\n </div>\n\n <span class=\"tk-workspaces-filters__count\">{{ resultCount }} workspace{{ resultCount === 1 ? '' : 's' }} in total</span>\n\n <button type=\"button\" class=\"tk-workspaces-filters__add-button\" [matMenuTriggerFor]=\"addMenu\">\n Add workspace\n <mat-icon class=\"tk-workspaces-filters__add-icon\">expand_more</mat-icon>\n </button>\n\n <mat-menu #addMenu=\"matMenu\">\n <button type=\"button\" mat-menu-item (click)=\"onAddWorkspace()\">Add workspace</button>\n <button type=\"button\" mat-menu-item disabled>Import workspaces</button>\n </mat-menu>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2}.tk-workspaces-filters{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap;font-size:.875rem;font-weight:400;color:#000000f2}.tk-workspaces-filters__search{position:relative;min-width:14rem}.tk-workspaces-filters__search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006;pointer-events:none}.tk-workspaces-filters__search-input{width:100%;height:34px;padding:6px 12px 6px 44px;border-radius:.5rem;outline:none;box-sizing:border-box;font-family:inherit;font-size:1rem;color:#000000f2;background:#fff}.tk-workspaces-filters__search-input::placeholder{color:#0006}.tk-workspaces-filters__filters{display:flex;align-items:center;gap:.5rem}.tk-workspaces-filters__filters-label{font-size:.875rem;color:#000000f2;white-space:nowrap}.tk-workspaces-filters__select-wrap{position:relative;display:flex;align-items:center}.tk-workspaces-filters__select{appearance:none;height:34px;padding:6px 32px 6px 12px;background:#fff;border:1px solid rgba(0,0,0,.5019607843);border-radius:.5rem;font-family:inherit;font-size:1rem;color:#222;cursor:pointer;box-sizing:border-box}.tk-workspaces-filters__select:focus{outline:none;border-color:#0006}.tk-workspaces-filters__select-icon{position:absolute;right:.375rem;font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006;pointer-events:none}.tk-workspaces-filters__count{margin-left:auto;font-size:.875rem;color:#0009;white-space:nowrap;font-weight:400;flex:1}.tk-workspaces-filters__add-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#000;color:#fff;border:none;border-radius:6.25rem;font-family:inherit;font-size:.8125rem;font-weight:500;cursor:pointer;white-space:nowrap}.tk-workspaces-filters__add-button:hover{background:#222}.tk-workspaces-filters__add-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}\n"] }]
|
|
388
|
+
args: [{ selector: 'tk-workspaces-filters', template: "<div class=\"tk-workspaces-filters\">\r\n <div class=\"tk-workspaces-filters__search\">\r\n <input\r\n class=\"tk-workspaces-filters__search-input blue-input\"\r\n type=\"text\"\r\n placeholder=\"Search\"\r\n [value]=\"searchTerm\"\r\n (input)=\"onSearchInputChange($event)\"\r\n />\r\n <mat-icon class=\"tk-workspaces-filters__search-icon\">search</mat-icon>\r\n </div>\r\n\r\n <div class=\"tk-workspaces-filters__filters\">\r\n <span class=\"tk-workspaces-filters__filters-label\">Filters:</span>\r\n\r\n <div class=\"tk-workspaces-filters__select-wrap\">\r\n <select\r\n class=\"tk-workspaces-filters__select\"\r\n [ngModel]=\"selectedType\"\r\n (ngModelChange)=\"onTypeChange($event)\">\r\n <option value=\"\">General</option>\r\n <option *ngFor=\"let type of typeOptions\" [value]=\"type\">{{ type }}</option>\r\n </select>\r\n <mat-icon class=\"tk-workspaces-filters__select-icon\">expand_more</mat-icon>\r\n </div>\r\n\r\n <div class=\"tk-workspaces-filters__select-wrap\">\r\n <select\r\n class=\"tk-workspaces-filters__select\"\r\n [ngModel]=\"selectedLocation\"\r\n (ngModelChange)=\"onLocationChange($event)\">\r\n <option value=\"\">Location</option>\r\n <option *ngFor=\"let location of locationOptions\" [value]=\"location\">{{ location }}</option>\r\n </select>\r\n <mat-icon class=\"tk-workspaces-filters__select-icon\">expand_more</mat-icon>\r\n </div>\r\n </div>\r\n\r\n <span class=\"tk-workspaces-filters__count\">{{ resultCount }} workspace{{ resultCount === 1 ? '' : 's' }} in total</span>\r\n\r\n <button type=\"button\" class=\"tk-workspaces-filters__add-button\" [matMenuTriggerFor]=\"addMenu\">\r\n Add workspace\r\n <mat-icon class=\"tk-workspaces-filters__add-icon\">expand_more</mat-icon>\r\n </button>\r\n\r\n <mat-menu #addMenu=\"matMenu\">\r\n <button type=\"button\" mat-menu-item (click)=\"onAddWorkspace()\">Add workspace</button>\r\n <button type=\"button\" mat-menu-item disabled>Import workspaces</button>\r\n </mat-menu>\r\n</div>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2}.tk-workspaces-filters{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap;font-size:.875rem;font-weight:400;color:#000000f2}.tk-workspaces-filters__search{position:relative;min-width:14rem}.tk-workspaces-filters__search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006;pointer-events:none}.tk-workspaces-filters__search-input{width:100%;height:34px;padding:6px 12px 6px 44px;border-radius:.5rem;outline:none;box-sizing:border-box;font-family:inherit;font-size:1rem;color:#000000f2;background:#fff}.tk-workspaces-filters__search-input::placeholder{color:#0006}.tk-workspaces-filters__filters{display:flex;align-items:center;gap:.5rem}.tk-workspaces-filters__filters-label{font-size:.875rem;color:#000000f2;white-space:nowrap}.tk-workspaces-filters__select-wrap{position:relative;display:flex;align-items:center}.tk-workspaces-filters__select{appearance:none;height:34px;padding:6px 32px 6px 12px;background:#fff;border:1px solid rgba(0,0,0,.5019607843);border-radius:.5rem;font-family:inherit;font-size:1rem;color:#222;cursor:pointer;box-sizing:border-box}.tk-workspaces-filters__select:focus{outline:none;border-color:#0006}.tk-workspaces-filters__select-icon{position:absolute;right:.375rem;font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006;pointer-events:none}.tk-workspaces-filters__count{margin-left:auto;font-size:.875rem;color:#0009;white-space:nowrap;font-weight:400;flex:1}.tk-workspaces-filters__add-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#000;color:#fff;border:none;border-radius:6.25rem;font-family:inherit;font-size:.8125rem;font-weight:500;cursor:pointer;white-space:nowrap}.tk-workspaces-filters__add-button:hover{background:#222}.tk-workspaces-filters__add-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}\n"] }]
|
|
389
389
|
}], propDecorators: { resultCount: [{
|
|
390
390
|
type: Input
|
|
391
391
|
}], typeOptions: [{
|
|
@@ -454,8 +454,11 @@ class WorkspacesTableComponent {
|
|
|
454
454
|
isSelected(workspaceId) {
|
|
455
455
|
return this.selectedIds.has(workspaceId);
|
|
456
456
|
}
|
|
457
|
-
onOpenWorkspace(workspace) {
|
|
458
|
-
this.openWorkspace.emit(workspace.id);
|
|
457
|
+
onOpenWorkspace(workspace, connectionType) {
|
|
458
|
+
this.openWorkspace.emit({ id: workspace.id, connectionType: connectionType ?? this.resolveConnectionType(workspace) });
|
|
459
|
+
}
|
|
460
|
+
resolveConnectionType(workspace) {
|
|
461
|
+
return !workspace.isHybrid && workspace.device.webexUUID != null ? 'webex' : 'di';
|
|
459
462
|
}
|
|
460
463
|
onAddDevice(workspace, event) {
|
|
461
464
|
event.stopPropagation();
|
|
@@ -488,10 +491,10 @@ class WorkspacesTableComponent {
|
|
|
488
491
|
}
|
|
489
492
|
}
|
|
490
493
|
WorkspacesTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WorkspacesTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
491
|
-
WorkspacesTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WorkspacesTableComponent, selector: "tk-workspaces-table", inputs: { workspaces: "workspaces", total: "total", pageIndex: "pageIndex", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", pendingWorkspaceIds: "pendingWorkspaceIds" }, outputs: { openWorkspace: "openWorkspace", licenseWithHybrid: "licenseWithHybrid", migrateToMT: "migrateToMT", enableWebexCalling: "enableWebexCalling", migrateToUCM: "migrateToUCM", addDevice: "addDevice", pageChange: "pageChange" }, ngImport: i0, template: "<div class=\"tk-workspaces-table__bulk-bar\">Select one or more workspaces for bulk actions</div>\n\n<div class=\"tk-workspaces-table__wrapper\">\n <table class=\"tk-workspaces-table__table\">\n <thead>\n <tr>\n <th class=\"tk-workspaces-table__checkbox-cell\">\n <input type=\"checkbox\" [checked]=\"allSelected\" [indeterminate]=\"someSelected\" (change)=\"toggleAll()\" />\n </th>\n <th>Name</th>\n <th>Devices</th>\n <th>Scheduling</th>\n <th>Calling</th>\n <th>Provisioning Type</th>\n <th>Status</th>\n <th class=\"tk-workspaces-table__settings-cell\">\n <mat-icon class=\"tk-workspaces-table__settings-icon\">settings</mat-icon>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr\n *ngFor=\"let workspace of workspaces\"\n [class.tk-workspaces-table__row--selected]=\"isSelected(workspace.id)\">\n <td class=\"tk-workspaces-table__checkbox-cell\">\n <input type=\"checkbox\" [checked]=\"isSelected(workspace.id)\" (change)=\"toggleRow(workspace.id)\" />\n </td>\n <td class=\"tk-workspaces-table__name-cell\" (click)=\"onOpenWorkspace(workspace)\">\n <div class=\"tk-workspaces-table__name-wrapper\">\n <span class=\"tk-workspaces-table__name-icon\">\n <img src=\"assets/icons/device-in-room-regular.svg\" alt=\"\" />\n </span>\n <div class=\"tk-workspaces-table__name-info\">\n <a href=\"javascript:void(0)\" class=\"tk-workspaces-table__name-link\">{{ workspace.displayName }}</a>\n <div class=\"tk-workspaces-table__name-meta\">\n <span class=\"tk-workspaces-table__name-type\">{{ workspace.typeLabel }}</span>\n <span class=\"tk-workspaces-table__meta-sep\">·</span>\n <img class=\"tk-workspaces-table__meta-icon\" src=\"assets/icons/people-regular.svg\" alt=\"\" />\n <span class=\"tk-workspaces-table__name-capacity\">{{ workspace.capacity ?? 'No capacity' }}</span>\n <span class=\"tk-workspaces-table__meta-sep\">·</span>\n <!-- <mat-icon class=\"tk-workspaces-table__meta-icon\">location_on</mat-icon> -->\n <img class=\"tk-workspaces-table__meta-icon\" src=\"assets/icons/location-regular.svg\" alt=\"\" />\n <a\n *ngIf=\"workspace.location; else noLocation\"\n href=\"javascript:void(0)\"\n class=\"tk-workspaces-table__location-link\">{{ workspace.location }}</a>\n <ng-template #noLocation>\n <span class=\"tk-workspaces-table__location-empty\">No location</span>\n </ng-template>\n </div>\n </div>\n </div>\n </td>\n <td>\n <div class=\"tk-workspaces-table__devices\">\n <ng-container *ngIf=\"workspace.devices.length; else noDevices\">\n <span *ngFor=\"let device of workspace.devices\" class=\"tk-workspaces-table__device-card\" [title]=\"device.label\">\n <img\n class=\"tk-workspaces-table__device-icon\"\n [src]=\"getDeviceIcon(device.model)\"\n [alt]=\"device.label\" />\n </span>\n </ng-container>\n <!-- <ng-container *ngFor=\"let device of workspace.devices\">\n <span *ngIf=\"device && device.model else noDevice\" class=\"tk-workspaces-table__device-card\" [title]=\"device.label\">\n <img\n class=\"tk-workspaces-table__device-icon\"\n [src]=\"getDeviceIcon(device.model)\"\n [alt]=\"device.label\" />\n </span>\n </ng-container> -->\n <ng-template #noDevices>\n <button\n type=\"button\"\n class=\"tk-workspaces-table__device-add\"\n (click)=\"onAddDevice(workspace, $event)\">\n <span class=\"tk-workspaces-table__device-add-label\">\n <img\n class=\"tk-workspaces-table__device-add-icon\"\n src=\"assets/icons/multipled-devices-regular.svg\"\n alt=\"\" />\n Add device\n </span>\n </button>\n </ng-template>\n </div>\n </td>\n <td>{{ workspace.scheduling }}</td>\n <td class=\"tk-workspaces-table__calling-cell\">\n <span class=\"tk-workspaces-table__calling-content\">\n <img class=\"tk-workspaces-table__calling-icon\" src=\"assets/icons/location-regular.svg\" alt=\"\" />\n <span class=\"tk-workspaces-table__calling-text\" title=\"Cisco Webex Calling Professional Workspace\">Cisco Webex Calling Professional Workspace</span>\n </span>\n </td>\n <td>\n <div *ngIf=\"workspace.isHybrid\" class=\"tk-workspaces-table__provisioning-icons\">\n <span class=\"icon-wrapper\"\n ><img\n src=\"assets/icons/webex.svg\"\n [matTooltip]=\"'Webex Calling'\"\n matTooltipPosition=\"right\"\n width=\"20\"\n alt=\"\"\n /></span>\n <span class=\"icon-wrapper\"\n ><img\n src=\"assets/icons/di_cloud_24.svg\"\n [matTooltip]=\"'Webex Calling DI'\"\n matTooltipPosition=\"right\"\n width=\"20\"\n alt=\"\"\n /></span>\n </div>\n <ng-container *ngIf=\"!workspace.isHybrid\">\n <span *ngIf=\"workspace.device.cucmId != null\" class=\"icon-wrapper\"\n ><img\n src=\"assets/icons/di_cloud_24.svg\"\n [matTooltip]=\"'Webex Calling DI'\"\n matTooltipPosition=\"right\"\n width=\"20\"\n alt=\"\"\n /></span>\n <span *ngIf=\"workspace.device.webexUUID != null\" class=\"icon-wrapper\"\n ><img\n src=\"assets/icons/webex.svg\"\n [matTooltip]=\"'Webex Calling'\"\n matTooltipPosition=\"right\"\n width=\"20\"\n alt=\"\"\n /></span>\n </ng-container>\n </td>\n <td>\n <span class=\"tk-workspaces-table__status\">\n <span\n class=\"tk-workspaces-table__status-dot\"\n [class.tk-workspaces-table__status-dot--hybrid]=\"workspace.isHybrid\"\n [class.tk-workspaces-table__status-dot--active]=\"!workspace.isHybrid\"></span>\n {{ workspace.isHybrid ? 'Hybrid' : 'Active' }}\n </span>\n </td>\n <td class=\"tk-workspaces-table__actions-cell\">\n <mat-progress-spinner\n *ngIf=\"isPending(workspace.id)\"\n class=\"tk-workspaces-table__actions-spinner\"\n [diameter]=\"20\"\n strokeWidth=\"2\"\n mode=\"indeterminate\">\n </mat-progress-spinner>\n <button\n *ngIf=\"!isPending(workspace.id)\"\n type=\"button\"\n class=\"tk-workspaces-table__actions-button\"\n [matMenuTriggerFor]=\"rowMenu\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #rowMenu=\"matMenu\">\n <button\n type=\"button\"\n mat-menu-item\n [disabled]=\"isMoveToMTDisabled(workspace)\"\n (click)=\"licenseWithHybrid.emit(workspace)\">\n License with Hybrid\n </button>\n <button\n type=\"button\"\n mat-menu-item\n [disabled]=\"isMoveToMTDisabled(workspace)\"\n (click)=\"migrateToMT.emit(workspace)\">\n Migrate User to MT\n </button>\n <button\n type=\"button\"\n mat-menu-item\n [disabled]=\"isEnableWebexCallingDisabled(workspace)\"\n (click)=\"enableWebexCalling.emit(workspace)\">\n Enable Webex Calling\n </button>\n <button\n type=\"button\"\n mat-menu-item\n [disabled]=\"isMigrateToUCMDisabled(workspace)\"\n (click)=\"migrateToUCM.emit(workspace)\">\n Migrate User to UCM\n </button>\n </mat-menu>\n </td>\n </tr>\n <tr *ngIf=\"!workspaces.length\">\n <td [attr.colspan]=\"8\" class=\"tk-workspaces-table__empty\">No workspaces to display.</td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<mat-paginator\n class=\"tk-workspaces-table__paginator\"\n [length]=\"total\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPage($event)\">\n</mat-paginator>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2}.tk-workspaces-table__bulk-bar{margin-bottom:1rem;font-size:.875rem;color:#000000f2}.tk-workspaces-table__wrapper{overflow-x:auto}.tk-workspaces-table__paginator{border:1px solid rgba(0,0,0,.12);border-top:none;background:#fff;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif}.tk-workspaces-table__table{width:100%;border-collapse:collapse;font-family:Inter,sans-serif}.tk-workspaces-table__table th{height:39px;padding:.5rem 1.5rem .5rem .75rem;background-color:#ededed;text-align:start;font-size:.75rem;font-weight:500;color:#000000b3;word-break:break-all;max-inline-size:100%;cursor:pointer}.tk-workspaces-table__table th:hover{background-color:#dedede}.tk-workspaces-table__table td{height:49px;padding:.5rem 1.5rem .5rem .75rem;box-shadow:inset 0 -1px #0003;background-color:#fff;text-align:start;font-size:.875rem;color:#000000f2;word-break:break-all;cursor:pointer;transition:background-color .2s,box-shadow .2s}.tk-workspaces-table__table tbody tr:hover td{background:#ededed}.tk-workspaces-table__table tbody tr.tk-workspaces-table__row--selected td{background:#f0f6ff}.tk-workspaces-table__checkbox-cell{width:2.5rem;cursor:default}.tk-workspaces-table__settings-cell{width:2.5rem;text-align:center}.tk-workspaces-table__settings-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#00000080}.tk-workspaces-table__name-cell{min-width:14rem}.tk-workspaces-table__name-wrapper{display:flex;align-items:center;gap:.625rem}.tk-workspaces-table__name-icon{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;flex-shrink:0;border-radius:50%;background:#2b2b2b;color:#fff}.tk-workspaces-table__name-icon img{height:1.125rem;width:1.125rem;filter:brightness(0) invert(1)}.tk-workspaces-table__name-info{display:flex;flex-direction:column;gap:.5rem;min-width:0}.tk-workspaces-table__name-link{color:#000000de;font-weight:500;text-decoration:none}.tk-workspaces-table__name-meta{display:flex;align-items:center;gap:.25rem;font-size:.875rem;color:#0009;white-space:nowrap}.tk-workspaces-table__name-meta .tk-workspaces-table__name-type,.tk-workspaces-table__name-meta .tk-workspaces-table__name-capacity{color:#0006}.tk-workspaces-table__meta-icon{font-size:.875rem;height:.875rem;width:.875rem;color:#0006}.tk-workspaces-table__meta-sep{color:#0000004d}.tk-workspaces-table__location-link{color:#0353a8;text-decoration:none}.tk-workspaces-table__location-empty{color:#0009}.tk-workspaces-table__devices{display:flex;align-items:flex-start;gap:.625rem;padding:.5rem 0}.tk-workspaces-table__device-card{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:.5rem;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;background:#fff;box-sizing:border-box;padding:12px;block-size:60px}.tk-workspaces-table__device-icon{inline-size:40px;display:inline-block;vertical-align:middle;max-inline-size:100%;block-size:auto}.tk-workspaces-table__device-avatar{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:50%;background:#757575;color:#fff;font-size:.6875rem;font-weight:600}.tk-workspaces-table__device-add{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3.5rem;padding:.5rem 1.25rem;border:none;border-radius:.5rem;background-color:#fff;background-image:url(\"data:image/svg+xml,%3Csvg width%3D%22186%22 height%3D%2274%22 viewBox%3D%220 0 186 74%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1 8.51269C1 4.09442 4.58172 0.512695 9 0.512695H65C69.4183 0.512695 73 4.09442 73 8.5127V64.5127C73 68.931 69.4183 72.5127 65 72.5127H9C4.58172 72.5127 1 68.931 1 64.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M1 8.51269C1 4.09442 4.58172 0.512695 9 0.512695H65C69.4183 0.512695 73 4.09442 73 8.5127V64.5127C73 68.931 69.4183 72.5127 65 72.5127H9C4.58172 72.5127 1 68.931 1 64.5127V8.51269Z%22 stroke%3D%22url(%23paint0_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M77 8.51269C77 4.09442 80.5817 0.512695 85 0.512695H111C115.418 0.512695 119 4.09442 119 8.5127V26.5127C119 30.931 115.418 34.5127 111 34.5127H85C80.5817 34.5127 77 30.931 77 26.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M77 8.51269C77 4.09442 80.5817 0.512695 85 0.512695H111C115.418 0.512695 119 4.09442 119 8.5127V26.5127C119 30.931 115.418 34.5127 111 34.5127H85C80.5817 34.5127 77 30.931 77 26.5127V8.51269Z%22 stroke%3D%22url(%23paint1_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M123 8.51269C123 4.09442 126.582 0.512695 131 0.512695H177C181.418 0.512695 185 4.09442 185 8.5127V26.5127C185 30.931 181.418 34.5127 177 34.5127H131C126.582 34.5127 123 30.931 123 26.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M123 8.51269C123 4.09442 126.582 0.512695 131 0.512695H177C181.418 0.512695 185 4.09442 185 8.5127V26.5127C185 30.931 181.418 34.5127 177 34.5127H131C126.582 34.5127 123 30.931 123 26.5127V8.51269Z%22 stroke%3D%22url(%23paint2_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M77 46.5127C77 42.0944 80.5817 38.5127 85 38.5127H131C135.418 38.5127 139 42.0944 139 46.5127V64.5127C139 68.931 135.418 72.5127 131 72.5127H85C80.5817 72.5127 77 68.931 77 64.5127V46.5127Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M77 46.5127C77 42.0944 80.5817 38.5127 85 38.5127H131C135.418 38.5127 139 42.0944 139 46.5127V64.5127C139 68.931 135.418 72.5127 131 72.5127H85C80.5817 72.5127 77 68.931 77 64.5127V46.5127Z%22 stroke%3D%22url(%23paint3_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M143 46.5127C143 42.0944 146.582 38.5127 151 38.5127H177C181.418 38.5127 185 42.0944 185 46.5127V64.5127C185 68.931 181.418 72.5127 177 72.5127H151C146.582 72.5127 143 68.931 143 64.5127V46.5127Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M143 46.5127C143 42.0944 146.582 38.5127 151 38.5127H177C181.418 38.5127 185 42.0944 185 46.5127V64.5127C185 68.931 181.418 72.5127 177 72.5127H151C146.582 72.5127 143 68.931 143 64.5127V46.5127Z%22 stroke%3D%22url(%23paint4_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cdefs%3E%3CradialGradient id%3D%22paint0_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient id%3D%22paint1_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient id%3D%22paint2_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient id%3D%22paint3_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient id%3D%22paint4_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\");background-repeat:no-repeat;background-position:center;background-size:contain;font-family:inherit;white-space:nowrap;cursor:pointer;box-sizing:border-box}.tk-workspaces-table__device-add-label{display:inline-flex;align-items:center;gap:.5rem;padding:.375rem .75rem;border-radius:999px;color:#000000f2;font-size:.875rem;transition:background-color .15s}.tk-workspaces-table__device-add:hover .tk-workspaces-table__device-add-label{background-color:#ededed}.tk-workspaces-table__device-add-icon{height:1.125rem;width:1.125rem}.tk-workspaces-table__devices-empty{color:#0000004d}.tk-workspaces-table__calling-cell{max-width:14rem}.tk-workspaces-table__calling-content{display:flex;align-items:center;gap:.375rem}.tk-workspaces-table__calling-icon{flex:none;width:1rem;height:1rem;opacity:.4}.tk-workspaces-table__calling-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tk-workspaces-table__provisioning-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0009}.tk-workspaces-table__provisioning-icons{display:flex;align-items:center;gap:.5rem}.tk-workspaces-table__status{display:inline-flex;align-items:center;gap:.375rem;white-space:nowrap}.tk-workspaces-table__status-dot{width:.5rem;height:.5rem;border-radius:50%;background:rgba(0,0,0,.3);flex-shrink:0}.tk-workspaces-table__status-dot--active{background:#1d805f}.tk-workspaces-table__status-dot--inactive{background:#c73636}.tk-workspaces-table__status-dot--hybrid{background:#639fff}.tk-workspaces-table__actions-cell{width:2.5rem;text-align:center}.tk-workspaces-table__actions-button{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:.25rem;color:#00000080;cursor:pointer;border-radius:4px}.tk-workspaces-table__actions-button:hover{background:rgba(0,0,0,.06)}.tk-workspaces-table__actions-spinner{display:inline-flex;margin:0 auto}.tk-workspaces-table__empty{padding:1.5rem;text-align:center;color:#0009;cursor:default}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i5.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
|
|
494
|
+
WorkspacesTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WorkspacesTableComponent, selector: "tk-workspaces-table", inputs: { workspaces: "workspaces", total: "total", pageIndex: "pageIndex", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", pendingWorkspaceIds: "pendingWorkspaceIds" }, outputs: { openWorkspace: "openWorkspace", licenseWithHybrid: "licenseWithHybrid", migrateToMT: "migrateToMT", enableWebexCalling: "enableWebexCalling", migrateToUCM: "migrateToUCM", addDevice: "addDevice", pageChange: "pageChange" }, ngImport: i0, template: "<div class=\"tk-workspaces-table__bulk-bar\">Select one or more workspaces for bulk actions</div>\r\n\r\n<div class=\"tk-workspaces-table__wrapper\">\r\n <table class=\"tk-workspaces-table__table\">\r\n <thead>\r\n <tr>\r\n <th class=\"tk-workspaces-table__checkbox-cell\">\r\n <input type=\"checkbox\" [checked]=\"allSelected\" [indeterminate]=\"someSelected\" (change)=\"toggleAll()\" />\r\n </th>\r\n <th>Name</th>\r\n <th>Devices</th>\r\n <th>Scheduling</th>\r\n <th>Calling</th>\r\n <th>Provisioning Type</th>\r\n <th>Status</th>\r\n <th class=\"tk-workspaces-table__settings-cell\">\r\n <mat-icon class=\"tk-workspaces-table__settings-icon\">settings</mat-icon>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"let workspace of workspaces\"\r\n [class.tk-workspaces-table__row--selected]=\"isSelected(workspace.id)\">\r\n <td class=\"tk-workspaces-table__checkbox-cell\">\r\n <input type=\"checkbox\" [checked]=\"isSelected(workspace.id)\" (change)=\"toggleRow(workspace.id)\" />\r\n </td>\r\n <td class=\"tk-workspaces-table__name-cell\" (click)=\"onOpenWorkspace(workspace)\">\r\n <div class=\"tk-workspaces-table__name-wrapper\">\r\n <span class=\"tk-workspaces-table__name-icon\">\r\n <img src=\"assets/icons/device-in-room-regular.svg\" alt=\"\" />\r\n </span>\r\n <div class=\"tk-workspaces-table__name-info\">\r\n <a href=\"javascript:void(0)\" class=\"tk-workspaces-table__name-link\">{{ workspace.displayName }}</a>\r\n <div class=\"tk-workspaces-table__name-meta\">\r\n <span class=\"tk-workspaces-table__name-type\">{{ workspace.typeLabel }}</span>\r\n <span class=\"tk-workspaces-table__meta-sep\">·</span>\r\n <img class=\"tk-workspaces-table__meta-icon\" src=\"assets/icons/people-regular.svg\" alt=\"\" />\r\n <span class=\"tk-workspaces-table__name-capacity\">{{ workspace.capacity ?? 'No capacity' }}</span>\r\n <span class=\"tk-workspaces-table__meta-sep\">·</span>\r\n <!-- <mat-icon class=\"tk-workspaces-table__meta-icon\">location_on</mat-icon> -->\r\n <img class=\"tk-workspaces-table__meta-icon\" src=\"assets/icons/location-regular.svg\" alt=\"\" />\r\n <a\r\n *ngIf=\"workspace.location; else noLocation\"\r\n href=\"javascript:void(0)\"\r\n class=\"tk-workspaces-table__location-link\">{{ workspace.location }}</a>\r\n <ng-template #noLocation>\r\n <span class=\"tk-workspaces-table__location-empty\">No location</span>\r\n </ng-template>\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"tk-workspaces-table__devices\">\r\n <ng-container *ngIf=\"workspace.devices.length; else noDevices\">\r\n <span *ngFor=\"let device of workspace.devices\" class=\"tk-workspaces-table__device-card\" [title]=\"device.label\">\r\n <img\r\n class=\"tk-workspaces-table__device-icon\"\r\n [src]=\"getDeviceIcon(device.model)\"\r\n [alt]=\"device.label\" />\r\n </span>\r\n </ng-container>\r\n <!-- <ng-container *ngFor=\"let device of workspace.devices\">\r\n <span *ngIf=\"device && device.model else noDevice\" class=\"tk-workspaces-table__device-card\" [title]=\"device.label\">\r\n <img\r\n class=\"tk-workspaces-table__device-icon\"\r\n [src]=\"getDeviceIcon(device.model)\"\r\n [alt]=\"device.label\" />\r\n </span>\r\n </ng-container> -->\r\n <ng-template #noDevices>\r\n <button\r\n type=\"button\"\r\n class=\"tk-workspaces-table__device-add\"\r\n (click)=\"onAddDevice(workspace, $event)\">\r\n <span class=\"tk-workspaces-table__device-add-label\">\r\n <img\r\n class=\"tk-workspaces-table__device-add-icon\"\r\n src=\"assets/icons/multipled-devices-regular.svg\"\r\n alt=\"\" />\r\n Add device\r\n </span>\r\n </button>\r\n </ng-template>\r\n </div>\r\n </td>\r\n <td>{{ workspace.scheduling }}</td>\r\n <td class=\"tk-workspaces-table__calling-cell\">\r\n <span class=\"tk-workspaces-table__calling-content\">\r\n <img class=\"tk-workspaces-table__calling-icon\" src=\"assets/icons/location-regular.svg\" alt=\"\" />\r\n <span class=\"tk-workspaces-table__calling-text\" title=\"Cisco Webex Calling Professional Workspace\">Cisco Webex Calling Professional Workspace</span>\r\n </span>\r\n </td>\r\n <td>\r\n <div *ngIf=\"workspace.isHybrid\" class=\"tk-workspaces-table__provisioning-icons\">\r\n <span class=\"icon-wrapper\" (click)=\"onOpenWorkspace(workspace, 'webex'); $event.stopPropagation()\"\r\n ><img\r\n src=\"assets/icons/webex.svg\"\r\n [matTooltip]=\"'Webex Calling'\"\r\n matTooltipPosition=\"right\"\r\n width=\"20\"\r\n alt=\"\"\r\n /></span>\r\n <span class=\"icon-wrapper\" (click)=\"onOpenWorkspace(workspace, 'di'); $event.stopPropagation()\"\r\n ><img\r\n src=\"assets/icons/di_cloud_24.svg\"\r\n [matTooltip]=\"'Webex Calling DI'\"\r\n matTooltipPosition=\"right\"\r\n width=\"20\"\r\n alt=\"\"\r\n /></span>\r\n </div>\r\n <ng-container *ngIf=\"!workspace.isHybrid\">\r\n <span *ngIf=\"workspace.device.cucmId != null\" class=\"icon-wrapper\" (click)=\"onOpenWorkspace(workspace, 'di'); $event.stopPropagation()\"\r\n ><img\r\n src=\"assets/icons/di_cloud_24.svg\"\r\n [matTooltip]=\"'Webex Calling DI'\"\r\n matTooltipPosition=\"right\"\r\n width=\"20\"\r\n alt=\"\"\r\n /></span>\r\n <span *ngIf=\"workspace.device.webexUUID != null\" class=\"icon-wrapper\" (click)=\"onOpenWorkspace(workspace, 'webex'); $event.stopPropagation()\"\r\n ><img\r\n src=\"assets/icons/webex.svg\"\r\n [matTooltip]=\"'Webex Calling'\"\r\n matTooltipPosition=\"right\"\r\n width=\"20\"\r\n alt=\"\"\r\n /></span>\r\n </ng-container>\r\n </td>\r\n <td>\r\n <span class=\"tk-workspaces-table__status\">\r\n <span\r\n class=\"tk-workspaces-table__status-dot\"\r\n [class.tk-workspaces-table__status-dot--hybrid]=\"workspace.isHybrid\"\r\n [class.tk-workspaces-table__status-dot--active]=\"!workspace.isHybrid\"></span>\r\n {{ workspace.isHybrid ? 'Hybrid' : 'Active' }}\r\n </span>\r\n </td>\r\n <td class=\"tk-workspaces-table__actions-cell\">\r\n <mat-progress-spinner\r\n *ngIf=\"isPending(workspace.id)\"\r\n class=\"tk-workspaces-table__actions-spinner\"\r\n [diameter]=\"20\"\r\n strokeWidth=\"2\"\r\n mode=\"indeterminate\">\r\n </mat-progress-spinner>\r\n <button\r\n *ngIf=\"!isPending(workspace.id)\"\r\n type=\"button\"\r\n class=\"tk-workspaces-table__actions-button\"\r\n [matMenuTriggerFor]=\"rowMenu\">\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #rowMenu=\"matMenu\">\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n [disabled]=\"isMoveToMTDisabled(workspace)\"\r\n (click)=\"licenseWithHybrid.emit(workspace)\">\r\n License with Hybrid\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n [disabled]=\"isMoveToMTDisabled(workspace)\"\r\n (click)=\"migrateToMT.emit(workspace)\">\r\n Migrate User to MT\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n [disabled]=\"isEnableWebexCallingDisabled(workspace)\"\r\n (click)=\"enableWebexCalling.emit(workspace)\">\r\n Enable Webex Calling\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n [disabled]=\"isMigrateToUCMDisabled(workspace)\"\r\n (click)=\"migrateToUCM.emit(workspace)\">\r\n Migrate User to UCM\r\n </button>\r\n </mat-menu>\r\n </td>\r\n </tr>\r\n <tr *ngIf=\"!workspaces.length\">\r\n <td [attr.colspan]=\"8\" class=\"tk-workspaces-table__empty\">No workspaces to display.</td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n</div>\r\n\r\n<mat-paginator\r\n class=\"tk-workspaces-table__paginator\"\r\n [length]=\"total\"\r\n [pageIndex]=\"pageIndex\"\r\n [pageSize]=\"pageSize\"\r\n [pageSizeOptions]=\"pageSizeOptions\"\r\n (page)=\"onPage($event)\">\r\n</mat-paginator>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2}.tk-workspaces-table__bulk-bar{margin-bottom:1rem;font-size:.875rem;color:#000000f2}.tk-workspaces-table__wrapper{overflow-x:auto}.tk-workspaces-table__paginator{border:1px solid rgba(0,0,0,.12);border-top:none;background:#fff;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif}.tk-workspaces-table__table{width:100%;border-collapse:collapse;font-family:Inter,sans-serif}.tk-workspaces-table__table th{height:39px;padding:.5rem 1.5rem .5rem .75rem;background-color:#ededed;text-align:start;font-size:.75rem;font-weight:500;color:#000000b3;word-break:break-all;max-inline-size:100%;cursor:pointer}.tk-workspaces-table__table th:hover{background-color:#dedede}.tk-workspaces-table__table td{height:49px;padding:.5rem 1.5rem .5rem .75rem;box-shadow:inset 0 -1px #0003;background-color:#fff;text-align:start;font-size:.875rem;color:#000000f2;word-break:break-all;cursor:pointer;transition:background-color .2s,box-shadow .2s}.tk-workspaces-table__table tbody tr:hover td{background:#ededed}.tk-workspaces-table__table tbody tr.tk-workspaces-table__row--selected td{background:#f0f6ff}.tk-workspaces-table__checkbox-cell{width:2.5rem;cursor:default}.tk-workspaces-table__settings-cell{width:2.5rem;text-align:center}.tk-workspaces-table__settings-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#00000080}.tk-workspaces-table__name-cell{min-width:14rem}.tk-workspaces-table__name-wrapper{display:flex;align-items:center;gap:.625rem}.tk-workspaces-table__name-icon{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;flex-shrink:0;border-radius:50%;background:#2b2b2b;color:#fff}.tk-workspaces-table__name-icon img{height:1.125rem;width:1.125rem;filter:brightness(0) invert(1)}.tk-workspaces-table__name-info{display:flex;flex-direction:column;gap:.5rem;min-width:0}.tk-workspaces-table__name-link{color:#000000de;font-weight:500;text-decoration:none}.tk-workspaces-table__name-meta{display:flex;align-items:center;gap:.25rem;font-size:.875rem;color:#0009;white-space:nowrap}.tk-workspaces-table__name-meta .tk-workspaces-table__name-type,.tk-workspaces-table__name-meta .tk-workspaces-table__name-capacity{color:#0006}.tk-workspaces-table__meta-icon{font-size:.875rem;height:.875rem;width:.875rem;color:#0006}.tk-workspaces-table__meta-sep{color:#0000004d}.tk-workspaces-table__location-link{color:#0353a8;text-decoration:none}.tk-workspaces-table__location-empty{color:#0009}.tk-workspaces-table__devices{display:flex;align-items:flex-start;gap:.625rem;padding:.5rem 0}.tk-workspaces-table__device-card{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:.5rem;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;background:#fff;box-sizing:border-box;padding:12px;block-size:60px}.tk-workspaces-table__device-icon{inline-size:40px;display:inline-block;vertical-align:middle;max-inline-size:100%;block-size:auto}.tk-workspaces-table__device-avatar{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:50%;background:#757575;color:#fff;font-size:.6875rem;font-weight:600}.tk-workspaces-table__device-add{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3.5rem;padding:.5rem 1.25rem;border:none;border-radius:.5rem;background-color:#fff;background-image:url(\"data:image/svg+xml,%3Csvg width%3D%22186%22 height%3D%2274%22 viewBox%3D%220 0 186 74%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0D%3Cpath d%3D%22M1 8.51269C1 4.09442 4.58172 0.512695 9 0.512695H65C69.4183 0.512695 73 4.09442 73 8.5127V64.5127C73 68.931 69.4183 72.5127 65 72.5127H9C4.58172 72.5127 1 68.931 1 64.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M1 8.51269C1 4.09442 4.58172 0.512695 9 0.512695H65C69.4183 0.512695 73 4.09442 73 8.5127V64.5127C73 68.931 69.4183 72.5127 65 72.5127H9C4.58172 72.5127 1 68.931 1 64.5127V8.51269Z%22 stroke%3D%22url(%23paint0_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M77 8.51269C77 4.09442 80.5817 0.512695 85 0.512695H111C115.418 0.512695 119 4.09442 119 8.5127V26.5127C119 30.931 115.418 34.5127 111 34.5127H85C80.5817 34.5127 77 30.931 77 26.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M77 8.51269C77 4.09442 80.5817 0.512695 85 0.512695H111C115.418 0.512695 119 4.09442 119 8.5127V26.5127C119 30.931 115.418 34.5127 111 34.5127H85C80.5817 34.5127 77 30.931 77 26.5127V8.51269Z%22 stroke%3D%22url(%23paint1_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M123 8.51269C123 4.09442 126.582 0.512695 131 0.512695H177C181.418 0.512695 185 4.09442 185 8.5127V26.5127C185 30.931 181.418 34.5127 177 34.5127H131C126.582 34.5127 123 30.931 123 26.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M123 8.51269C123 4.09442 126.582 0.512695 131 0.512695H177C181.418 0.512695 185 4.09442 185 8.5127V26.5127C185 30.931 181.418 34.5127 177 34.5127H131C126.582 34.5127 123 30.931 123 26.5127V8.51269Z%22 stroke%3D%22url(%23paint2_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M77 46.5127C77 42.0944 80.5817 38.5127 85 38.5127H131C135.418 38.5127 139 42.0944 139 46.5127V64.5127C139 68.931 135.418 72.5127 131 72.5127H85C80.5817 72.5127 77 68.931 77 64.5127V46.5127Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M77 46.5127C77 42.0944 80.5817 38.5127 85 38.5127H131C135.418 38.5127 139 42.0944 139 46.5127V64.5127C139 68.931 135.418 72.5127 131 72.5127H85C80.5817 72.5127 77 68.931 77 64.5127V46.5127Z%22 stroke%3D%22url(%23paint3_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M143 46.5127C143 42.0944 146.582 38.5127 151 38.5127H177C181.418 38.5127 185 42.0944 185 46.5127V64.5127C185 68.931 181.418 72.5127 177 72.5127H151C146.582 72.5127 143 68.931 143 64.5127V46.5127Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M143 46.5127C143 42.0944 146.582 38.5127 151 38.5127H177C181.418 38.5127 185 42.0944 185 46.5127V64.5127C185 68.931 181.418 72.5127 177 72.5127H151C146.582 72.5127 143 68.931 143 64.5127V46.5127Z%22 stroke%3D%22url(%23paint4_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cdefs%3E%0D%3CradialGradient id%3D%22paint0_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3CradialGradient id%3D%22paint1_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3CradialGradient id%3D%22paint2_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3CradialGradient id%3D%22paint3_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3CradialGradient id%3D%22paint4_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3C%2Fdefs%3E%0D%3C%2Fsvg%3E%0D\");background-repeat:no-repeat;background-position:center;background-size:contain;font-family:inherit;white-space:nowrap;cursor:pointer;box-sizing:border-box}.tk-workspaces-table__device-add-label{display:inline-flex;align-items:center;gap:.5rem;padding:.375rem .75rem;border-radius:999px;color:#000000f2;font-size:.875rem;transition:background-color .15s}.tk-workspaces-table__device-add:hover .tk-workspaces-table__device-add-label{background-color:#ededed}.tk-workspaces-table__device-add-icon{height:1.125rem;width:1.125rem}.tk-workspaces-table__devices-empty{color:#0000004d}.tk-workspaces-table__calling-cell{max-width:14rem}.tk-workspaces-table__calling-content{display:flex;align-items:center;gap:.375rem}.tk-workspaces-table__calling-icon{flex:none;width:1rem;height:1rem;opacity:.4}.tk-workspaces-table__calling-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tk-workspaces-table__provisioning-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0009}.tk-workspaces-table__provisioning-icons{display:flex;align-items:center;gap:.5rem}.tk-workspaces-table__status{display:inline-flex;align-items:center;gap:.375rem;white-space:nowrap}.tk-workspaces-table__status-dot{width:.5rem;height:.5rem;border-radius:50%;background:rgba(0,0,0,.3);flex-shrink:0}.tk-workspaces-table__status-dot--active{background:#1d805f}.tk-workspaces-table__status-dot--inactive{background:#c73636}.tk-workspaces-table__status-dot--hybrid{background:#639fff}.tk-workspaces-table__actions-cell{width:2.5rem;text-align:center}.tk-workspaces-table__actions-button{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:.25rem;color:#00000080;cursor:pointer;border-radius:4px}.tk-workspaces-table__actions-button:hover{background:rgba(0,0,0,.06)}.tk-workspaces-table__actions-spinner{display:inline-flex;margin:0 auto}.tk-workspaces-table__empty{padding:1.5rem;text-align:center;color:#0009;cursor:default}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i5.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
|
|
492
495
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WorkspacesTableComponent, decorators: [{
|
|
493
496
|
type: Component,
|
|
494
|
-
args: [{ selector: 'tk-workspaces-table', template: "<div class=\"tk-workspaces-table__bulk-bar\">Select one or more workspaces for bulk actions</div>\n\n<div class=\"tk-workspaces-table__wrapper\">\n <table class=\"tk-workspaces-table__table\">\n <thead>\n <tr>\n <th class=\"tk-workspaces-table__checkbox-cell\">\n <input type=\"checkbox\" [checked]=\"allSelected\" [indeterminate]=\"someSelected\" (change)=\"toggleAll()\" />\n </th>\n <th>Name</th>\n <th>Devices</th>\n <th>Scheduling</th>\n <th>Calling</th>\n <th>Provisioning Type</th>\n <th>Status</th>\n <th class=\"tk-workspaces-table__settings-cell\">\n <mat-icon class=\"tk-workspaces-table__settings-icon\">settings</mat-icon>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr\n *ngFor=\"let workspace of workspaces\"\n [class.tk-workspaces-table__row--selected]=\"isSelected(workspace.id)\">\n <td class=\"tk-workspaces-table__checkbox-cell\">\n <input type=\"checkbox\" [checked]=\"isSelected(workspace.id)\" (change)=\"toggleRow(workspace.id)\" />\n </td>\n <td class=\"tk-workspaces-table__name-cell\" (click)=\"onOpenWorkspace(workspace)\">\n <div class=\"tk-workspaces-table__name-wrapper\">\n <span class=\"tk-workspaces-table__name-icon\">\n <img src=\"assets/icons/device-in-room-regular.svg\" alt=\"\" />\n </span>\n <div class=\"tk-workspaces-table__name-info\">\n <a href=\"javascript:void(0)\" class=\"tk-workspaces-table__name-link\">{{ workspace.displayName }}</a>\n <div class=\"tk-workspaces-table__name-meta\">\n <span class=\"tk-workspaces-table__name-type\">{{ workspace.typeLabel }}</span>\n <span class=\"tk-workspaces-table__meta-sep\">·</span>\n <img class=\"tk-workspaces-table__meta-icon\" src=\"assets/icons/people-regular.svg\" alt=\"\" />\n <span class=\"tk-workspaces-table__name-capacity\">{{ workspace.capacity ?? 'No capacity' }}</span>\n <span class=\"tk-workspaces-table__meta-sep\">·</span>\n <!-- <mat-icon class=\"tk-workspaces-table__meta-icon\">location_on</mat-icon> -->\n <img class=\"tk-workspaces-table__meta-icon\" src=\"assets/icons/location-regular.svg\" alt=\"\" />\n <a\n *ngIf=\"workspace.location; else noLocation\"\n href=\"javascript:void(0)\"\n class=\"tk-workspaces-table__location-link\">{{ workspace.location }}</a>\n <ng-template #noLocation>\n <span class=\"tk-workspaces-table__location-empty\">No location</span>\n </ng-template>\n </div>\n </div>\n </div>\n </td>\n <td>\n <div class=\"tk-workspaces-table__devices\">\n <ng-container *ngIf=\"workspace.devices.length; else noDevices\">\n <span *ngFor=\"let device of workspace.devices\" class=\"tk-workspaces-table__device-card\" [title]=\"device.label\">\n <img\n class=\"tk-workspaces-table__device-icon\"\n [src]=\"getDeviceIcon(device.model)\"\n [alt]=\"device.label\" />\n </span>\n </ng-container>\n <!-- <ng-container *ngFor=\"let device of workspace.devices\">\n <span *ngIf=\"device && device.model else noDevice\" class=\"tk-workspaces-table__device-card\" [title]=\"device.label\">\n <img\n class=\"tk-workspaces-table__device-icon\"\n [src]=\"getDeviceIcon(device.model)\"\n [alt]=\"device.label\" />\n </span>\n </ng-container> -->\n <ng-template #noDevices>\n <button\n type=\"button\"\n class=\"tk-workspaces-table__device-add\"\n (click)=\"onAddDevice(workspace, $event)\">\n <span class=\"tk-workspaces-table__device-add-label\">\n <img\n class=\"tk-workspaces-table__device-add-icon\"\n src=\"assets/icons/multipled-devices-regular.svg\"\n alt=\"\" />\n Add device\n </span>\n </button>\n </ng-template>\n </div>\n </td>\n <td>{{ workspace.scheduling }}</td>\n <td class=\"tk-workspaces-table__calling-cell\">\n <span class=\"tk-workspaces-table__calling-content\">\n <img class=\"tk-workspaces-table__calling-icon\" src=\"assets/icons/location-regular.svg\" alt=\"\" />\n <span class=\"tk-workspaces-table__calling-text\" title=\"Cisco Webex Calling Professional Workspace\">Cisco Webex Calling Professional Workspace</span>\n </span>\n </td>\n <td>\n <div *ngIf=\"workspace.isHybrid\" class=\"tk-workspaces-table__provisioning-icons\">\n <span class=\"icon-wrapper\"\n ><img\n src=\"assets/icons/webex.svg\"\n [matTooltip]=\"'Webex Calling'\"\n matTooltipPosition=\"right\"\n width=\"20\"\n alt=\"\"\n /></span>\n <span class=\"icon-wrapper\"\n ><img\n src=\"assets/icons/di_cloud_24.svg\"\n [matTooltip]=\"'Webex Calling DI'\"\n matTooltipPosition=\"right\"\n width=\"20\"\n alt=\"\"\n /></span>\n </div>\n <ng-container *ngIf=\"!workspace.isHybrid\">\n <span *ngIf=\"workspace.device.cucmId != null\" class=\"icon-wrapper\"\n ><img\n src=\"assets/icons/di_cloud_24.svg\"\n [matTooltip]=\"'Webex Calling DI'\"\n matTooltipPosition=\"right\"\n width=\"20\"\n alt=\"\"\n /></span>\n <span *ngIf=\"workspace.device.webexUUID != null\" class=\"icon-wrapper\"\n ><img\n src=\"assets/icons/webex.svg\"\n [matTooltip]=\"'Webex Calling'\"\n matTooltipPosition=\"right\"\n width=\"20\"\n alt=\"\"\n /></span>\n </ng-container>\n </td>\n <td>\n <span class=\"tk-workspaces-table__status\">\n <span\n class=\"tk-workspaces-table__status-dot\"\n [class.tk-workspaces-table__status-dot--hybrid]=\"workspace.isHybrid\"\n [class.tk-workspaces-table__status-dot--active]=\"!workspace.isHybrid\"></span>\n {{ workspace.isHybrid ? 'Hybrid' : 'Active' }}\n </span>\n </td>\n <td class=\"tk-workspaces-table__actions-cell\">\n <mat-progress-spinner\n *ngIf=\"isPending(workspace.id)\"\n class=\"tk-workspaces-table__actions-spinner\"\n [diameter]=\"20\"\n strokeWidth=\"2\"\n mode=\"indeterminate\">\n </mat-progress-spinner>\n <button\n *ngIf=\"!isPending(workspace.id)\"\n type=\"button\"\n class=\"tk-workspaces-table__actions-button\"\n [matMenuTriggerFor]=\"rowMenu\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #rowMenu=\"matMenu\">\n <button\n type=\"button\"\n mat-menu-item\n [disabled]=\"isMoveToMTDisabled(workspace)\"\n (click)=\"licenseWithHybrid.emit(workspace)\">\n License with Hybrid\n </button>\n <button\n type=\"button\"\n mat-menu-item\n [disabled]=\"isMoveToMTDisabled(workspace)\"\n (click)=\"migrateToMT.emit(workspace)\">\n Migrate User to MT\n </button>\n <button\n type=\"button\"\n mat-menu-item\n [disabled]=\"isEnableWebexCallingDisabled(workspace)\"\n (click)=\"enableWebexCalling.emit(workspace)\">\n Enable Webex Calling\n </button>\n <button\n type=\"button\"\n mat-menu-item\n [disabled]=\"isMigrateToUCMDisabled(workspace)\"\n (click)=\"migrateToUCM.emit(workspace)\">\n Migrate User to UCM\n </button>\n </mat-menu>\n </td>\n </tr>\n <tr *ngIf=\"!workspaces.length\">\n <td [attr.colspan]=\"8\" class=\"tk-workspaces-table__empty\">No workspaces to display.</td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<mat-paginator\n class=\"tk-workspaces-table__paginator\"\n [length]=\"total\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPage($event)\">\n</mat-paginator>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2}.tk-workspaces-table__bulk-bar{margin-bottom:1rem;font-size:.875rem;color:#000000f2}.tk-workspaces-table__wrapper{overflow-x:auto}.tk-workspaces-table__paginator{border:1px solid rgba(0,0,0,.12);border-top:none;background:#fff;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif}.tk-workspaces-table__table{width:100%;border-collapse:collapse;font-family:Inter,sans-serif}.tk-workspaces-table__table th{height:39px;padding:.5rem 1.5rem .5rem .75rem;background-color:#ededed;text-align:start;font-size:.75rem;font-weight:500;color:#000000b3;word-break:break-all;max-inline-size:100%;cursor:pointer}.tk-workspaces-table__table th:hover{background-color:#dedede}.tk-workspaces-table__table td{height:49px;padding:.5rem 1.5rem .5rem .75rem;box-shadow:inset 0 -1px #0003;background-color:#fff;text-align:start;font-size:.875rem;color:#000000f2;word-break:break-all;cursor:pointer;transition:background-color .2s,box-shadow .2s}.tk-workspaces-table__table tbody tr:hover td{background:#ededed}.tk-workspaces-table__table tbody tr.tk-workspaces-table__row--selected td{background:#f0f6ff}.tk-workspaces-table__checkbox-cell{width:2.5rem;cursor:default}.tk-workspaces-table__settings-cell{width:2.5rem;text-align:center}.tk-workspaces-table__settings-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#00000080}.tk-workspaces-table__name-cell{min-width:14rem}.tk-workspaces-table__name-wrapper{display:flex;align-items:center;gap:.625rem}.tk-workspaces-table__name-icon{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;flex-shrink:0;border-radius:50%;background:#2b2b2b;color:#fff}.tk-workspaces-table__name-icon img{height:1.125rem;width:1.125rem;filter:brightness(0) invert(1)}.tk-workspaces-table__name-info{display:flex;flex-direction:column;gap:.5rem;min-width:0}.tk-workspaces-table__name-link{color:#000000de;font-weight:500;text-decoration:none}.tk-workspaces-table__name-meta{display:flex;align-items:center;gap:.25rem;font-size:.875rem;color:#0009;white-space:nowrap}.tk-workspaces-table__name-meta .tk-workspaces-table__name-type,.tk-workspaces-table__name-meta .tk-workspaces-table__name-capacity{color:#0006}.tk-workspaces-table__meta-icon{font-size:.875rem;height:.875rem;width:.875rem;color:#0006}.tk-workspaces-table__meta-sep{color:#0000004d}.tk-workspaces-table__location-link{color:#0353a8;text-decoration:none}.tk-workspaces-table__location-empty{color:#0009}.tk-workspaces-table__devices{display:flex;align-items:flex-start;gap:.625rem;padding:.5rem 0}.tk-workspaces-table__device-card{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:.5rem;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;background:#fff;box-sizing:border-box;padding:12px;block-size:60px}.tk-workspaces-table__device-icon{inline-size:40px;display:inline-block;vertical-align:middle;max-inline-size:100%;block-size:auto}.tk-workspaces-table__device-avatar{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:50%;background:#757575;color:#fff;font-size:.6875rem;font-weight:600}.tk-workspaces-table__device-add{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3.5rem;padding:.5rem 1.25rem;border:none;border-radius:.5rem;background-color:#fff;background-image:url(\"data:image/svg+xml,%3Csvg width%3D%22186%22 height%3D%2274%22 viewBox%3D%220 0 186 74%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1 8.51269C1 4.09442 4.58172 0.512695 9 0.512695H65C69.4183 0.512695 73 4.09442 73 8.5127V64.5127C73 68.931 69.4183 72.5127 65 72.5127H9C4.58172 72.5127 1 68.931 1 64.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M1 8.51269C1 4.09442 4.58172 0.512695 9 0.512695H65C69.4183 0.512695 73 4.09442 73 8.5127V64.5127C73 68.931 69.4183 72.5127 65 72.5127H9C4.58172 72.5127 1 68.931 1 64.5127V8.51269Z%22 stroke%3D%22url(%23paint0_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M77 8.51269C77 4.09442 80.5817 0.512695 85 0.512695H111C115.418 0.512695 119 4.09442 119 8.5127V26.5127C119 30.931 115.418 34.5127 111 34.5127H85C80.5817 34.5127 77 30.931 77 26.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M77 8.51269C77 4.09442 80.5817 0.512695 85 0.512695H111C115.418 0.512695 119 4.09442 119 8.5127V26.5127C119 30.931 115.418 34.5127 111 34.5127H85C80.5817 34.5127 77 30.931 77 26.5127V8.51269Z%22 stroke%3D%22url(%23paint1_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M123 8.51269C123 4.09442 126.582 0.512695 131 0.512695H177C181.418 0.512695 185 4.09442 185 8.5127V26.5127C185 30.931 181.418 34.5127 177 34.5127H131C126.582 34.5127 123 30.931 123 26.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M123 8.51269C123 4.09442 126.582 0.512695 131 0.512695H177C181.418 0.512695 185 4.09442 185 8.5127V26.5127C185 30.931 181.418 34.5127 177 34.5127H131C126.582 34.5127 123 30.931 123 26.5127V8.51269Z%22 stroke%3D%22url(%23paint2_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M77 46.5127C77 42.0944 80.5817 38.5127 85 38.5127H131C135.418 38.5127 139 42.0944 139 46.5127V64.5127C139 68.931 135.418 72.5127 131 72.5127H85C80.5817 72.5127 77 68.931 77 64.5127V46.5127Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M77 46.5127C77 42.0944 80.5817 38.5127 85 38.5127H131C135.418 38.5127 139 42.0944 139 46.5127V64.5127C139 68.931 135.418 72.5127 131 72.5127H85C80.5817 72.5127 77 68.931 77 64.5127V46.5127Z%22 stroke%3D%22url(%23paint3_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M143 46.5127C143 42.0944 146.582 38.5127 151 38.5127H177C181.418 38.5127 185 42.0944 185 46.5127V64.5127C185 68.931 181.418 72.5127 177 72.5127H151C146.582 72.5127 143 68.931 143 64.5127V46.5127Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cpath d%3D%22M143 46.5127C143 42.0944 146.582 38.5127 151 38.5127H177C181.418 38.5127 185 42.0944 185 46.5127V64.5127C185 68.931 181.418 72.5127 177 72.5127H151C146.582 72.5127 143 68.931 143 64.5127V46.5127Z%22 stroke%3D%22url(%23paint4_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%3Cdefs%3E%3CradialGradient id%3D%22paint0_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient id%3D%22paint1_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient id%3D%22paint2_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient id%3D%22paint3_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3CradialGradient id%3D%22paint4_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%3Cstop stop-color%3D%22white%22%2F%3E%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%3C%2FradialGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\");background-repeat:no-repeat;background-position:center;background-size:contain;font-family:inherit;white-space:nowrap;cursor:pointer;box-sizing:border-box}.tk-workspaces-table__device-add-label{display:inline-flex;align-items:center;gap:.5rem;padding:.375rem .75rem;border-radius:999px;color:#000000f2;font-size:.875rem;transition:background-color .15s}.tk-workspaces-table__device-add:hover .tk-workspaces-table__device-add-label{background-color:#ededed}.tk-workspaces-table__device-add-icon{height:1.125rem;width:1.125rem}.tk-workspaces-table__devices-empty{color:#0000004d}.tk-workspaces-table__calling-cell{max-width:14rem}.tk-workspaces-table__calling-content{display:flex;align-items:center;gap:.375rem}.tk-workspaces-table__calling-icon{flex:none;width:1rem;height:1rem;opacity:.4}.tk-workspaces-table__calling-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tk-workspaces-table__provisioning-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0009}.tk-workspaces-table__provisioning-icons{display:flex;align-items:center;gap:.5rem}.tk-workspaces-table__status{display:inline-flex;align-items:center;gap:.375rem;white-space:nowrap}.tk-workspaces-table__status-dot{width:.5rem;height:.5rem;border-radius:50%;background:rgba(0,0,0,.3);flex-shrink:0}.tk-workspaces-table__status-dot--active{background:#1d805f}.tk-workspaces-table__status-dot--inactive{background:#c73636}.tk-workspaces-table__status-dot--hybrid{background:#639fff}.tk-workspaces-table__actions-cell{width:2.5rem;text-align:center}.tk-workspaces-table__actions-button{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:.25rem;color:#00000080;cursor:pointer;border-radius:4px}.tk-workspaces-table__actions-button:hover{background:rgba(0,0,0,.06)}.tk-workspaces-table__actions-spinner{display:inline-flex;margin:0 auto}.tk-workspaces-table__empty{padding:1.5rem;text-align:center;color:#0009;cursor:default}\n"] }]
|
|
497
|
+
args: [{ selector: 'tk-workspaces-table', template: "<div class=\"tk-workspaces-table__bulk-bar\">Select one or more workspaces for bulk actions</div>\r\n\r\n<div class=\"tk-workspaces-table__wrapper\">\r\n <table class=\"tk-workspaces-table__table\">\r\n <thead>\r\n <tr>\r\n <th class=\"tk-workspaces-table__checkbox-cell\">\r\n <input type=\"checkbox\" [checked]=\"allSelected\" [indeterminate]=\"someSelected\" (change)=\"toggleAll()\" />\r\n </th>\r\n <th>Name</th>\r\n <th>Devices</th>\r\n <th>Scheduling</th>\r\n <th>Calling</th>\r\n <th>Provisioning Type</th>\r\n <th>Status</th>\r\n <th class=\"tk-workspaces-table__settings-cell\">\r\n <mat-icon class=\"tk-workspaces-table__settings-icon\">settings</mat-icon>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"let workspace of workspaces\"\r\n [class.tk-workspaces-table__row--selected]=\"isSelected(workspace.id)\">\r\n <td class=\"tk-workspaces-table__checkbox-cell\">\r\n <input type=\"checkbox\" [checked]=\"isSelected(workspace.id)\" (change)=\"toggleRow(workspace.id)\" />\r\n </td>\r\n <td class=\"tk-workspaces-table__name-cell\" (click)=\"onOpenWorkspace(workspace)\">\r\n <div class=\"tk-workspaces-table__name-wrapper\">\r\n <span class=\"tk-workspaces-table__name-icon\">\r\n <img src=\"assets/icons/device-in-room-regular.svg\" alt=\"\" />\r\n </span>\r\n <div class=\"tk-workspaces-table__name-info\">\r\n <a href=\"javascript:void(0)\" class=\"tk-workspaces-table__name-link\">{{ workspace.displayName }}</a>\r\n <div class=\"tk-workspaces-table__name-meta\">\r\n <span class=\"tk-workspaces-table__name-type\">{{ workspace.typeLabel }}</span>\r\n <span class=\"tk-workspaces-table__meta-sep\">·</span>\r\n <img class=\"tk-workspaces-table__meta-icon\" src=\"assets/icons/people-regular.svg\" alt=\"\" />\r\n <span class=\"tk-workspaces-table__name-capacity\">{{ workspace.capacity ?? 'No capacity' }}</span>\r\n <span class=\"tk-workspaces-table__meta-sep\">·</span>\r\n <!-- <mat-icon class=\"tk-workspaces-table__meta-icon\">location_on</mat-icon> -->\r\n <img class=\"tk-workspaces-table__meta-icon\" src=\"assets/icons/location-regular.svg\" alt=\"\" />\r\n <a\r\n *ngIf=\"workspace.location; else noLocation\"\r\n href=\"javascript:void(0)\"\r\n class=\"tk-workspaces-table__location-link\">{{ workspace.location }}</a>\r\n <ng-template #noLocation>\r\n <span class=\"tk-workspaces-table__location-empty\">No location</span>\r\n </ng-template>\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"tk-workspaces-table__devices\">\r\n <ng-container *ngIf=\"workspace.devices.length; else noDevices\">\r\n <span *ngFor=\"let device of workspace.devices\" class=\"tk-workspaces-table__device-card\" [title]=\"device.label\">\r\n <img\r\n class=\"tk-workspaces-table__device-icon\"\r\n [src]=\"getDeviceIcon(device.model)\"\r\n [alt]=\"device.label\" />\r\n </span>\r\n </ng-container>\r\n <!-- <ng-container *ngFor=\"let device of workspace.devices\">\r\n <span *ngIf=\"device && device.model else noDevice\" class=\"tk-workspaces-table__device-card\" [title]=\"device.label\">\r\n <img\r\n class=\"tk-workspaces-table__device-icon\"\r\n [src]=\"getDeviceIcon(device.model)\"\r\n [alt]=\"device.label\" />\r\n </span>\r\n </ng-container> -->\r\n <ng-template #noDevices>\r\n <button\r\n type=\"button\"\r\n class=\"tk-workspaces-table__device-add\"\r\n (click)=\"onAddDevice(workspace, $event)\">\r\n <span class=\"tk-workspaces-table__device-add-label\">\r\n <img\r\n class=\"tk-workspaces-table__device-add-icon\"\r\n src=\"assets/icons/multipled-devices-regular.svg\"\r\n alt=\"\" />\r\n Add device\r\n </span>\r\n </button>\r\n </ng-template>\r\n </div>\r\n </td>\r\n <td>{{ workspace.scheduling }}</td>\r\n <td class=\"tk-workspaces-table__calling-cell\">\r\n <span class=\"tk-workspaces-table__calling-content\">\r\n <img class=\"tk-workspaces-table__calling-icon\" src=\"assets/icons/location-regular.svg\" alt=\"\" />\r\n <span class=\"tk-workspaces-table__calling-text\" title=\"Cisco Webex Calling Professional Workspace\">Cisco Webex Calling Professional Workspace</span>\r\n </span>\r\n </td>\r\n <td>\r\n <div *ngIf=\"workspace.isHybrid\" class=\"tk-workspaces-table__provisioning-icons\">\r\n <span class=\"icon-wrapper\" (click)=\"onOpenWorkspace(workspace, 'webex'); $event.stopPropagation()\"\r\n ><img\r\n src=\"assets/icons/webex.svg\"\r\n [matTooltip]=\"'Webex Calling'\"\r\n matTooltipPosition=\"right\"\r\n width=\"20\"\r\n alt=\"\"\r\n /></span>\r\n <span class=\"icon-wrapper\" (click)=\"onOpenWorkspace(workspace, 'di'); $event.stopPropagation()\"\r\n ><img\r\n src=\"assets/icons/di_cloud_24.svg\"\r\n [matTooltip]=\"'Webex Calling DI'\"\r\n matTooltipPosition=\"right\"\r\n width=\"20\"\r\n alt=\"\"\r\n /></span>\r\n </div>\r\n <ng-container *ngIf=\"!workspace.isHybrid\">\r\n <span *ngIf=\"workspace.device.cucmId != null\" class=\"icon-wrapper\" (click)=\"onOpenWorkspace(workspace, 'di'); $event.stopPropagation()\"\r\n ><img\r\n src=\"assets/icons/di_cloud_24.svg\"\r\n [matTooltip]=\"'Webex Calling DI'\"\r\n matTooltipPosition=\"right\"\r\n width=\"20\"\r\n alt=\"\"\r\n /></span>\r\n <span *ngIf=\"workspace.device.webexUUID != null\" class=\"icon-wrapper\" (click)=\"onOpenWorkspace(workspace, 'webex'); $event.stopPropagation()\"\r\n ><img\r\n src=\"assets/icons/webex.svg\"\r\n [matTooltip]=\"'Webex Calling'\"\r\n matTooltipPosition=\"right\"\r\n width=\"20\"\r\n alt=\"\"\r\n /></span>\r\n </ng-container>\r\n </td>\r\n <td>\r\n <span class=\"tk-workspaces-table__status\">\r\n <span\r\n class=\"tk-workspaces-table__status-dot\"\r\n [class.tk-workspaces-table__status-dot--hybrid]=\"workspace.isHybrid\"\r\n [class.tk-workspaces-table__status-dot--active]=\"!workspace.isHybrid\"></span>\r\n {{ workspace.isHybrid ? 'Hybrid' : 'Active' }}\r\n </span>\r\n </td>\r\n <td class=\"tk-workspaces-table__actions-cell\">\r\n <mat-progress-spinner\r\n *ngIf=\"isPending(workspace.id)\"\r\n class=\"tk-workspaces-table__actions-spinner\"\r\n [diameter]=\"20\"\r\n strokeWidth=\"2\"\r\n mode=\"indeterminate\">\r\n </mat-progress-spinner>\r\n <button\r\n *ngIf=\"!isPending(workspace.id)\"\r\n type=\"button\"\r\n class=\"tk-workspaces-table__actions-button\"\r\n [matMenuTriggerFor]=\"rowMenu\">\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #rowMenu=\"matMenu\">\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n [disabled]=\"isMoveToMTDisabled(workspace)\"\r\n (click)=\"licenseWithHybrid.emit(workspace)\">\r\n License with Hybrid\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n [disabled]=\"isMoveToMTDisabled(workspace)\"\r\n (click)=\"migrateToMT.emit(workspace)\">\r\n Migrate User to MT\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n [disabled]=\"isEnableWebexCallingDisabled(workspace)\"\r\n (click)=\"enableWebexCalling.emit(workspace)\">\r\n Enable Webex Calling\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n [disabled]=\"isMigrateToUCMDisabled(workspace)\"\r\n (click)=\"migrateToUCM.emit(workspace)\">\r\n Migrate User to UCM\r\n </button>\r\n </mat-menu>\r\n </td>\r\n </tr>\r\n <tr *ngIf=\"!workspaces.length\">\r\n <td [attr.colspan]=\"8\" class=\"tk-workspaces-table__empty\">No workspaces to display.</td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n</div>\r\n\r\n<mat-paginator\r\n class=\"tk-workspaces-table__paginator\"\r\n [length]=\"total\"\r\n [pageIndex]=\"pageIndex\"\r\n [pageSize]=\"pageSize\"\r\n [pageSizeOptions]=\"pageSizeOptions\"\r\n (page)=\"onPage($event)\">\r\n</mat-paginator>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2}.tk-workspaces-table__bulk-bar{margin-bottom:1rem;font-size:.875rem;color:#000000f2}.tk-workspaces-table__wrapper{overflow-x:auto}.tk-workspaces-table__paginator{border:1px solid rgba(0,0,0,.12);border-top:none;background:#fff;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif}.tk-workspaces-table__table{width:100%;border-collapse:collapse;font-family:Inter,sans-serif}.tk-workspaces-table__table th{height:39px;padding:.5rem 1.5rem .5rem .75rem;background-color:#ededed;text-align:start;font-size:.75rem;font-weight:500;color:#000000b3;word-break:break-all;max-inline-size:100%;cursor:pointer}.tk-workspaces-table__table th:hover{background-color:#dedede}.tk-workspaces-table__table td{height:49px;padding:.5rem 1.5rem .5rem .75rem;box-shadow:inset 0 -1px #0003;background-color:#fff;text-align:start;font-size:.875rem;color:#000000f2;word-break:break-all;cursor:pointer;transition:background-color .2s,box-shadow .2s}.tk-workspaces-table__table tbody tr:hover td{background:#ededed}.tk-workspaces-table__table tbody tr.tk-workspaces-table__row--selected td{background:#f0f6ff}.tk-workspaces-table__checkbox-cell{width:2.5rem;cursor:default}.tk-workspaces-table__settings-cell{width:2.5rem;text-align:center}.tk-workspaces-table__settings-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#00000080}.tk-workspaces-table__name-cell{min-width:14rem}.tk-workspaces-table__name-wrapper{display:flex;align-items:center;gap:.625rem}.tk-workspaces-table__name-icon{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;flex-shrink:0;border-radius:50%;background:#2b2b2b;color:#fff}.tk-workspaces-table__name-icon img{height:1.125rem;width:1.125rem;filter:brightness(0) invert(1)}.tk-workspaces-table__name-info{display:flex;flex-direction:column;gap:.5rem;min-width:0}.tk-workspaces-table__name-link{color:#000000de;font-weight:500;text-decoration:none}.tk-workspaces-table__name-meta{display:flex;align-items:center;gap:.25rem;font-size:.875rem;color:#0009;white-space:nowrap}.tk-workspaces-table__name-meta .tk-workspaces-table__name-type,.tk-workspaces-table__name-meta .tk-workspaces-table__name-capacity{color:#0006}.tk-workspaces-table__meta-icon{font-size:.875rem;height:.875rem;width:.875rem;color:#0006}.tk-workspaces-table__meta-sep{color:#0000004d}.tk-workspaces-table__location-link{color:#0353a8;text-decoration:none}.tk-workspaces-table__location-empty{color:#0009}.tk-workspaces-table__devices{display:flex;align-items:flex-start;gap:.625rem;padding:.5rem 0}.tk-workspaces-table__device-card{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:.5rem;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;background:#fff;box-sizing:border-box;padding:12px;block-size:60px}.tk-workspaces-table__device-icon{inline-size:40px;display:inline-block;vertical-align:middle;max-inline-size:100%;block-size:auto}.tk-workspaces-table__device-avatar{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:50%;background:#757575;color:#fff;font-size:.6875rem;font-weight:600}.tk-workspaces-table__device-add{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3.5rem;padding:.5rem 1.25rem;border:none;border-radius:.5rem;background-color:#fff;background-image:url(\"data:image/svg+xml,%3Csvg width%3D%22186%22 height%3D%2274%22 viewBox%3D%220 0 186 74%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0D%3Cpath d%3D%22M1 8.51269C1 4.09442 4.58172 0.512695 9 0.512695H65C69.4183 0.512695 73 4.09442 73 8.5127V64.5127C73 68.931 69.4183 72.5127 65 72.5127H9C4.58172 72.5127 1 68.931 1 64.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M1 8.51269C1 4.09442 4.58172 0.512695 9 0.512695H65C69.4183 0.512695 73 4.09442 73 8.5127V64.5127C73 68.931 69.4183 72.5127 65 72.5127H9C4.58172 72.5127 1 68.931 1 64.5127V8.51269Z%22 stroke%3D%22url(%23paint0_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M77 8.51269C77 4.09442 80.5817 0.512695 85 0.512695H111C115.418 0.512695 119 4.09442 119 8.5127V26.5127C119 30.931 115.418 34.5127 111 34.5127H85C80.5817 34.5127 77 30.931 77 26.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M77 8.51269C77 4.09442 80.5817 0.512695 85 0.512695H111C115.418 0.512695 119 4.09442 119 8.5127V26.5127C119 30.931 115.418 34.5127 111 34.5127H85C80.5817 34.5127 77 30.931 77 26.5127V8.51269Z%22 stroke%3D%22url(%23paint1_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M123 8.51269C123 4.09442 126.582 0.512695 131 0.512695H177C181.418 0.512695 185 4.09442 185 8.5127V26.5127C185 30.931 181.418 34.5127 177 34.5127H131C126.582 34.5127 123 30.931 123 26.5127V8.51269Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M123 8.51269C123 4.09442 126.582 0.512695 131 0.512695H177C181.418 0.512695 185 4.09442 185 8.5127V26.5127C185 30.931 181.418 34.5127 177 34.5127H131C126.582 34.5127 123 30.931 123 26.5127V8.51269Z%22 stroke%3D%22url(%23paint2_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M77 46.5127C77 42.0944 80.5817 38.5127 85 38.5127H131C135.418 38.5127 139 42.0944 139 46.5127V64.5127C139 68.931 135.418 72.5127 131 72.5127H85C80.5817 72.5127 77 68.931 77 64.5127V46.5127Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M77 46.5127C77 42.0944 80.5817 38.5127 85 38.5127H131C135.418 38.5127 139 42.0944 139 46.5127V64.5127C139 68.931 135.418 72.5127 131 72.5127H85C80.5817 72.5127 77 68.931 77 64.5127V46.5127Z%22 stroke%3D%22url(%23paint3_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M143 46.5127C143 42.0944 146.582 38.5127 151 38.5127H177C181.418 38.5127 185 42.0944 185 46.5127V64.5127C185 68.931 181.418 72.5127 177 72.5127H151C146.582 72.5127 143 68.931 143 64.5127V46.5127Z%22 stroke%3D%22%23DEDEDE%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cpath d%3D%22M143 46.5127C143 42.0944 146.582 38.5127 151 38.5127H177C181.418 38.5127 185 42.0944 185 46.5127V64.5127C185 68.931 181.418 72.5127 177 72.5127H151C146.582 72.5127 143 68.931 143 64.5127V46.5127Z%22 stroke%3D%22url(%23paint4_radial_6222_238881)%22 stroke-dasharray%3D%224 4%22%2F%3E%0D%3Cdefs%3E%0D%3CradialGradient id%3D%22paint0_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3CradialGradient id%3D%22paint1_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3CradialGradient id%3D%22paint2_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3CradialGradient id%3D%22paint3_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3CradialGradient id%3D%22paint4_radial_6222_238881%22 cx%3D%220%22 cy%3D%220%22 r%3D%221%22 gradientUnits%3D%22userSpaceOnUse%22 gradientTransform%3D%22translate(93 36.5127) rotate(90) scale(36 92)%22%3E%0D%3Cstop stop-color%3D%22white%22%2F%3E%0D%3Cstop offset%3D%221%22 stop-color%3D%22white%22 stop-opacity%3D%220%22%2F%3E%0D%3C%2FradialGradient%3E%0D%3C%2Fdefs%3E%0D%3C%2Fsvg%3E%0D\");background-repeat:no-repeat;background-position:center;background-size:contain;font-family:inherit;white-space:nowrap;cursor:pointer;box-sizing:border-box}.tk-workspaces-table__device-add-label{display:inline-flex;align-items:center;gap:.5rem;padding:.375rem .75rem;border-radius:999px;color:#000000f2;font-size:.875rem;transition:background-color .15s}.tk-workspaces-table__device-add:hover .tk-workspaces-table__device-add-label{background-color:#ededed}.tk-workspaces-table__device-add-icon{height:1.125rem;width:1.125rem}.tk-workspaces-table__devices-empty{color:#0000004d}.tk-workspaces-table__calling-cell{max-width:14rem}.tk-workspaces-table__calling-content{display:flex;align-items:center;gap:.375rem}.tk-workspaces-table__calling-icon{flex:none;width:1rem;height:1rem;opacity:.4}.tk-workspaces-table__calling-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tk-workspaces-table__provisioning-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0009}.tk-workspaces-table__provisioning-icons{display:flex;align-items:center;gap:.5rem}.tk-workspaces-table__status{display:inline-flex;align-items:center;gap:.375rem;white-space:nowrap}.tk-workspaces-table__status-dot{width:.5rem;height:.5rem;border-radius:50%;background:rgba(0,0,0,.3);flex-shrink:0}.tk-workspaces-table__status-dot--active{background:#1d805f}.tk-workspaces-table__status-dot--inactive{background:#c73636}.tk-workspaces-table__status-dot--hybrid{background:#639fff}.tk-workspaces-table__actions-cell{width:2.5rem;text-align:center}.tk-workspaces-table__actions-button{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:.25rem;color:#00000080;cursor:pointer;border-radius:4px}.tk-workspaces-table__actions-button:hover{background:rgba(0,0,0,.06)}.tk-workspaces-table__actions-spinner{display:inline-flex;margin:0 auto}.tk-workspaces-table__empty{padding:1.5rem;text-align:center;color:#0009;cursor:default}\n"] }]
|
|
495
498
|
}], propDecorators: { workspaces: [{
|
|
496
499
|
type: Input
|
|
497
500
|
}], total: [{
|
|
@@ -575,6 +578,7 @@ class WorkspaceDetailComponent {
|
|
|
575
578
|
constructor(workspaceDetailService, location) {
|
|
576
579
|
this.workspaceDetailService = workspaceDetailService;
|
|
577
580
|
this.location = location;
|
|
581
|
+
this.connectionType = 'di';
|
|
578
582
|
this.back = new EventEmitter();
|
|
579
583
|
this.activeTab = 'overview';
|
|
580
584
|
this.details = null;
|
|
@@ -586,6 +590,9 @@ class WorkspaceDetailComponent {
|
|
|
586
590
|
this.updateUrl();
|
|
587
591
|
}
|
|
588
592
|
get deviceName() {
|
|
593
|
+
if (this.connectionType === 'webex') {
|
|
594
|
+
return this.workspace.device?.webexUUID || this.workspace.device?.name || this.workspace.id;
|
|
595
|
+
}
|
|
589
596
|
return this.workspace.device?.name || this.workspace.id;
|
|
590
597
|
}
|
|
591
598
|
resolveIcon(model) {
|
|
@@ -604,12 +611,14 @@ class WorkspaceDetailComponent {
|
|
|
604
611
|
}
|
|
605
612
|
}
|
|
606
613
|
WorkspaceDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WorkspaceDetailComponent, deps: [{ token: WorkspaceDetailService }, { token: i2.Location }], target: i0.ɵɵFactoryTarget.Component });
|
|
607
|
-
WorkspaceDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WorkspaceDetailComponent, selector: "tk-workspace-detail", inputs: { workspace: "workspace" }, outputs: { back: "back" }, ngImport: i0, template: "<button type=\"button\" class=\"tk-workspace-detail__breadcrumb\" (click)=\"onBack()\">\n <mat-icon>chevron_left</mat-icon>\n Workspaces\n</button>\n\n<div class=\"tk-workspace-detail__header\">\n <span class=\"tk-workspace-detail__icon\">\n <img src=\"assets/icons/device-in-room-regular.svg\" alt=\"\" />\n </span>\n <div class=\"tk-workspace-detail__title-block\">\n <h1 class=\"tk-workspace-detail__name\">{{ workspace.displayName }}</h1>\n <div class=\"tk-workspace-detail__meta\">\n <span class=\"tk-workspace-detail__status\">\n <span class=\"tk-workspace-detail__status-dot\"></span>\n Live status unavailable\n </span>\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\n <span>Type: {{ workspace.typeLabel === 'No type' ? 'Not set' : workspace.typeLabel }}</span>\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\n <img class=\"tk-workspace-detail__meta-icon\" src=\"assets/icons/people-regular.svg\" alt=\"\" />\n <span>Capacity: {{ workspace.capacity ?? 'Not set' }}</span>\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\n <span class=\"tk-workspace-detail__meta-muted\">Size not set</span>\n </div>\n </div>\n <button type=\"button\" class=\"tk-workspace-detail__actions-button\" [matMenuTriggerFor]=\"actionsMenu\">\n Actions\n <mat-icon>expand_more</mat-icon>\n </button>\n <mat-menu #actionsMenu=\"matMenu\">\n <button type=\"button\" mat-menu-item disabled>More actions coming soon</button>\n </mat-menu>\n</div>\n\n<nav class=\"tk-workspace-detail__tabs\">\n <button\n type=\"button\"\n class=\"tk-workspace-detail__tab\"\n [class.tk-workspace-detail__tab--active]=\"activeTab === 'overview'\"\n (click)=\"selectTab('overview')\">\n Overview\n </button>\n <button\n type=\"button\"\n class=\"tk-workspace-detail__tab\"\n [class.tk-workspace-detail__tab--active]=\"activeTab === 'calling'\"\n (click)=\"selectTab('calling')\">\n Calling\n </button>\n</nav>\n\n<ng-container *ngIf=\"details\">\n <div class=\"tk-workspace-detail__grid\" *ngIf=\"activeTab === 'overview'\">\n <div class=\"tk-workspace-detail__col\">\n <section class=\"tk-workspace-detail__card\" *ngIf=\"details.issues.length\">\n <h2 class=\"tk-workspace-detail__card-title\">Issues & Information</h2>\n <div class=\"tk-workspace-detail__issue\" *ngFor=\"let issue of details.issues\">\n <div class=\"tk-workspace-detail__issue-info\">\n <mat-icon class=\"tk-workspace-detail__issue-icon\">info</mat-icon>\n <div>\n <div class=\"tk-workspace-detail__issue-message\">{{ issue.message }}</div>\n <div class=\"tk-workspace-detail__issue-timestamp\">{{ issue.timestamp }}</div>\n </div>\n </div>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">\n {{ issue.actionLabel }}\n <mat-icon>expand_more</mat-icon>\n </button>\n </div>\n </section>\n\n <section class=\"tk-workspace-detail__card\">\n <div class=\"tk-workspace-detail__card-header\">\n <h2 class=\"tk-workspace-detail__card-title\">Devices</h2>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add device</button>\n </div>\n <div class=\"tk-workspace-detail__devices\" *ngIf=\"workspace.devices.length; else noDevices\">\n <div class=\"tk-workspace-detail__device\" *ngFor=\"let device of workspace.devices\">\n <img class=\"tk-workspace-detail__device-icon\" [src]=\"resolveIcon(device.model)\" [alt]=\"device.label\" />\n <div class=\"tk-workspace-detail__device-info\">\n <a href=\"javascript:void(0)\" class=\"tk-workspace-detail__device-link\">{{ device.label }}</a>\n <div class=\"tk-workspace-detail__device-status\">\n <span class=\"tk-workspace-detail__status-dot\"></span>\n Status unavailable\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\n </div>\n </div>\n </div>\n </div>\n <ng-template #noDevices>\n <div class=\"tk-workspace-detail__empty\">No devices assigned.</div>\n </ng-template>\n </section>\n\n <section class=\"tk-workspace-detail__card\">\n <div class=\"tk-workspace-detail__card-header\">\n <h2 class=\"tk-workspace-detail__card-title\">Calling</h2>\n <mat-icon class=\"tk-workspace-detail__settings-icon\">settings</mat-icon>\n </div>\n <div class=\"tk-workspace-detail__calling-license\">\n <mat-icon>call</mat-icon>\n {{ details.calling.license }}\n </div>\n <hr class=\"tk-workspace-detail__divider\" />\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Cisco Webex SIP Address</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.sipAddress }}</span>\n </div>\n </section>\n\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\" *ngIf=\"!details.schedulingConfigured\">\n <mat-icon class=\"tk-workspace-detail__card-icon\">event</mat-icon>\n <h3 class=\"tk-workspace-detail__card-heading\">Choose scheduling</h3>\n <p class=\"tk-workspace-detail__card-text\">Choose a calendar service or setup hot-desking for this workspace.</p>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Choose scheduling</button>\n </section>\n\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\">\n <mat-icon class=\"tk-workspace-detail__card-icon\">info</mat-icon>\n <h3 class=\"tk-workspace-detail__card-heading\">Device hosted meetings unavailable</h3>\n <p class=\"tk-workspace-detail__card-text\">Service not supported by Cisco IP phones</p>\n </section>\n\n <section class=\"tk-workspace-detail__card\">\n <h2 class=\"tk-workspace-detail__card-title\">\n Planned Maintenance\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\n </h2>\n <div class=\"tk-workspace-detail__row\">\n <mat-icon>build</mat-icon>\n <span>{{ details.plannedMaintenanceEnabled ? 'On' : 'Off' }}</span>\n </div>\n <hr class=\"tk-workspace-detail__divider\" />\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--with-action\">\n <div class=\"tk-workspace-detail__row\">\n <mat-icon>event</mat-icon>\n <div>\n <div>Schedule</div>\n <div class=\"tk-workspace-detail__row-hint\">No schedule set</div>\n </div>\n </div>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Edit schedule</button>\n </div>\n </section>\n\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\" *ngIf=\"!details.notes\">\n <mat-icon class=\"tk-workspace-detail__card-icon\">description</mat-icon>\n <h3 class=\"tk-workspace-detail__card-heading\">Add notes</h3>\n <p class=\"tk-workspace-detail__card-text\">Write a note about this workspace.</p>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add notes</button>\n </section>\n </div>\n\n <div class=\"tk-workspace-detail__col\">\n <section class=\"tk-workspace-detail__card\">\n <div class=\"tk-workspace-detail__card-header\">\n <h2 class=\"tk-workspace-detail__card-title\">Location</h2>\n <mat-icon class=\"tk-workspace-detail__settings-icon\">settings</mat-icon>\n </div>\n <div class=\"tk-workspace-detail__location\">\n <mat-icon>location_on</mat-icon>\n <div>\n <a href=\"javascript:void(0)\" class=\"tk-workspace-detail__location-link\">{{ details.location.country }}</a>\n <div class=\"tk-workspace-detail__location-address\">{{ details.location.address }}</div>\n </div>\n </div>\n <hr class=\"tk-workspace-detail__divider\" />\n <div class=\"tk-workspace-detail__row\">\n <mat-icon>explore</mat-icon>\n <span>Indoor navigation</span>\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\n </div>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add URL</button>\n <div class=\"tk-workspace-detail__map\">\n <mat-icon class=\"tk-workspace-detail__map-pin\">location_on</mat-icon>\n </div>\n </section>\n </div>\n </div>\n\n <div class=\"tk-workspace-detail__grid\" *ngIf=\"activeTab === 'calling'\">\n <div class=\"tk-workspace-detail__col\">\n <section class=\"tk-workspace-detail__card\">\n <h2 class=\"tk-workspace-detail__card-title\">Calling</h2>\n <div class=\"tk-workspace-detail__calling-license\">\n <mat-icon>call</mat-icon>\n {{ details.calling.license }}\n </div>\n <hr class=\"tk-workspace-detail__divider\" />\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Cisco Webex SIP Address</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.sipAddress }}</span>\n </div>\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Directory Number</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.directoryNumber }}</span>\n </div>\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Route Partition</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.routePartition }}</span>\n </div>\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Calling Search Space</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.callingSearchSpace }}</span>\n </div>\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Device Security Profile</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.securityProfile }}</span>\n </div>\n </section>\n </div>\n </div>\n</ng-container>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2;padding:1.5rem}.tk-workspace-detail__breadcrumb{display:inline-flex;align-items:center;gap:.125rem;padding:0;margin-bottom:1rem;background:none;border:none;font-family:inherit;font-size:.875rem;font-weight:500;color:#0009;cursor:pointer}.tk-workspace-detail__breadcrumb:hover{color:#000000f2}.tk-workspace-detail__breadcrumb mat-icon{font-size:1.25rem;height:1.25rem;width:1.25rem}.tk-workspace-detail__header{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1rem}.tk-workspace-detail__icon{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;flex-shrink:0;border-radius:50%;background:#2b2b2b}.tk-workspace-detail__icon img{height:1.375rem;width:1.375rem;filter:brightness(0) invert(1)}.tk-workspace-detail__title-block{flex:1;min-width:0}.tk-workspace-detail__name{margin:0 0 .375rem;font-size:1.25rem;font-weight:600}.tk-workspace-detail__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.375rem;font-size:.875rem;color:#0009}.tk-workspace-detail__meta-sep{color:#0000004d}.tk-workspace-detail__meta-icon{height:.875rem;width:.875rem;opacity:.4}.tk-workspace-detail__meta-muted{color:#0006}.tk-workspace-detail__actions-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#000;color:#fff;border:none;border-radius:6.25rem;font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;flex-shrink:0}.tk-workspace-detail__actions-button:hover{background:#2b2b2b}.tk-workspace-detail__actions-button mat-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__tabs{display:flex;align-items:center;gap:1.5rem;border-bottom:1px solid rgba(0,0,0,.12);margin-bottom:1.25rem}.tk-workspace-detail__tab{padding:.75rem 0;background:none;border:none;border-bottom:2px solid transparent;font-family:inherit;font-size:.9375rem;font-weight:500;color:#000000b3;cursor:pointer}.tk-workspace-detail__tab:hover{color:#000000f2}.tk-workspace-detail__tab--active{color:#000000f2;border-bottom-color:#000}.tk-workspace-detail__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem;align-items:start}@media (max-width: 900px){.tk-workspace-detail__grid{grid-template-columns:1fr}}.tk-workspace-detail__col{display:flex;flex-direction:column;gap:1.25rem;min-width:0}.tk-workspace-detail__card{background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;padding:1.25rem}.tk-workspace-detail__card--centered{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.375rem;padding:2rem 1.25rem}.tk-workspace-detail__card-icon{color:#0009;margin-bottom:.5rem}.tk-workspace-detail__card-heading{margin:0;font-size:.9375rem;font-weight:600}.tk-workspace-detail__card-text{margin:0 0 .5rem;font-size:.8125rem;color:#0009;max-width:20rem}.tk-workspace-detail__card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.tk-workspace-detail__card-title{display:flex;align-items:center;gap:.375rem;margin:0 0 .75rem;font-size:.9375rem;font-weight:600}.tk-workspace-detail__card-header .tk-workspace-detail__card-title{margin-bottom:0}.tk-workspace-detail__settings-icon,.tk-workspace-detail__info-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006}.tk-workspace-detail__divider{border:none;border-top:1px solid rgba(0,0,0,.12);margin:.75rem 0}.tk-workspace-detail__issue{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 0;border-top:1px solid rgba(0,0,0,.12)}.tk-workspace-detail__issue:first-of-type{border-top:none;padding-top:0}.tk-workspace-detail__issue-info{display:flex;align-items:flex-start;gap:.5rem}.tk-workspace-detail__issue-icon{color:#0353a8;font-size:1.125rem;height:1.125rem;width:1.125rem;margin-top:.125rem}.tk-workspace-detail__issue-message{font-size:.875rem;font-weight:500}.tk-workspace-detail__issue-timestamp{font-size:.75rem;color:#0006}.tk-workspace-detail__pill-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#fff;border:1px solid rgba(0,0,0,.3);border-radius:6.25rem;font-family:inherit;font-size:.8125rem;font-weight:500;color:#000000f2;cursor:pointer;white-space:nowrap}.tk-workspace-detail__pill-button:hover{background:#ededed}.tk-workspace-detail__pill-button mat-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__devices{display:flex;flex-wrap:wrap;gap:.75rem}.tk-workspace-detail__device{display:flex;align-items:center;gap:.625rem;padding:.75rem;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;min-width:12rem}.tk-workspace-detail__device-icon{width:2.25rem;height:auto;flex-shrink:0}.tk-workspace-detail__device-link{color:#0353a8;text-decoration:none;font-size:.875rem;font-weight:500}.tk-workspace-detail__device-status{display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:#0009}.tk-workspace-detail__empty{font-size:.875rem;color:#0009}.tk-workspace-detail__calling-license{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.tk-workspace-detail__calling-license mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__row{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.tk-workspace-detail__row mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem;flex-shrink:0}.tk-workspace-detail__row--with-action{justify-content:space-between}.tk-workspace-detail__row--kv{justify-content:space-between;padding:.5rem 0;border-top:1px solid rgba(0,0,0,.12)}.tk-workspace-detail__row--kv:first-of-type{border-top:none}.tk-workspace-detail__row-label{color:#0009}.tk-workspace-detail__row-value{font-weight:500;text-align:right}.tk-workspace-detail__row-hint{font-size:.75rem;color:#0006}.tk-workspace-detail__location{display:flex;align-items:flex-start;gap:.5rem}.tk-workspace-detail__location mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem;margin-top:.125rem}.tk-workspace-detail__location-link{color:#0353a8;text-decoration:none;font-size:.875rem;font-weight:500}.tk-workspace-detail__location-address{font-size:.8125rem;color:#0009}.tk-workspace-detail__map{display:flex;align-items:center;justify-content:center;height:12rem;margin-top:1rem;border-radius:.5rem;background:linear-gradient(135deg,#eef1e8 0%,#e4e9dc 100%)}.tk-workspace-detail__map-pin{color:#c73636;font-size:2rem;height:2rem;width:2rem}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] });
|
|
614
|
+
WorkspaceDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WorkspaceDetailComponent, selector: "tk-workspace-detail", inputs: { workspace: "workspace", connectionType: "connectionType" }, outputs: { back: "back" }, ngImport: i0, template: "<button type=\"button\" class=\"tk-workspace-detail__breadcrumb\" (click)=\"onBack()\">\r\n <mat-icon>chevron_left</mat-icon>\r\n Workspaces\r\n</button>\r\n\r\n<div class=\"tk-workspace-detail__header\">\r\n <span class=\"tk-workspace-detail__icon\">\r\n <img src=\"assets/icons/device-in-room-regular.svg\" alt=\"\" />\r\n </span>\r\n <div class=\"tk-workspace-detail__title-block\">\r\n <h1 class=\"tk-workspace-detail__name\">{{ workspace.displayName }}</h1>\r\n <div class=\"tk-workspace-detail__meta\">\r\n <span class=\"tk-workspace-detail__status\">\r\n <span class=\"tk-workspace-detail__status-dot\"></span>\r\n Live status unavailable\r\n </span>\r\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\r\n <span>Type: {{ workspace.typeLabel === 'No type' ? 'Not set' : workspace.typeLabel }}</span>\r\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\r\n <img class=\"tk-workspace-detail__meta-icon\" src=\"assets/icons/people-regular.svg\" alt=\"\" />\r\n <span>Capacity: {{ workspace.capacity ?? 'Not set' }}</span>\r\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\r\n <span class=\"tk-workspace-detail__meta-muted\">Size not set</span>\r\n </div>\r\n </div>\r\n <button type=\"button\" class=\"tk-workspace-detail__actions-button\" [matMenuTriggerFor]=\"actionsMenu\">\r\n Actions\r\n <mat-icon>expand_more</mat-icon>\r\n </button>\r\n <mat-menu #actionsMenu=\"matMenu\">\r\n <button type=\"button\" mat-menu-item disabled>More actions coming soon</button>\r\n </mat-menu>\r\n</div>\r\n\r\n<nav class=\"tk-workspace-detail__tabs\">\r\n <button\r\n type=\"button\"\r\n class=\"tk-workspace-detail__tab\"\r\n [class.tk-workspace-detail__tab--active]=\"activeTab === 'overview'\"\r\n (click)=\"selectTab('overview')\">\r\n Overview\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"tk-workspace-detail__tab\"\r\n [class.tk-workspace-detail__tab--active]=\"activeTab === 'calling'\"\r\n (click)=\"selectTab('calling')\">\r\n Calling\r\n </button>\r\n</nav>\r\n\r\n<ng-container *ngIf=\"details\">\r\n <div class=\"tk-workspace-detail__grid\" *ngIf=\"activeTab === 'overview'\">\r\n <div class=\"tk-workspace-detail__col\">\r\n <section class=\"tk-workspace-detail__card\" *ngIf=\"details.issues.length\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Issues & Information</h2>\r\n <div class=\"tk-workspace-detail__issue\" *ngFor=\"let issue of details.issues\">\r\n <div class=\"tk-workspace-detail__issue-info\">\r\n <mat-icon class=\"tk-workspace-detail__issue-icon\">info</mat-icon>\r\n <div>\r\n <div class=\"tk-workspace-detail__issue-message\">{{ issue.message }}</div>\r\n <div class=\"tk-workspace-detail__issue-timestamp\">{{ issue.timestamp }}</div>\r\n </div>\r\n </div>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">\r\n {{ issue.actionLabel }}\r\n <mat-icon>expand_more</mat-icon>\r\n </button>\r\n </div>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card\">\r\n <div class=\"tk-workspace-detail__card-header\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Devices</h2>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add device</button>\r\n </div>\r\n <div class=\"tk-workspace-detail__devices\" *ngIf=\"workspace.devices.length; else noDevices\">\r\n <div class=\"tk-workspace-detail__device\" *ngFor=\"let device of workspace.devices\">\r\n <img class=\"tk-workspace-detail__device-icon\" [src]=\"resolveIcon(device.model)\" [alt]=\"device.label\" />\r\n <div class=\"tk-workspace-detail__device-info\">\r\n <a href=\"javascript:void(0)\" class=\"tk-workspace-detail__device-link\">{{ device.label }}</a>\r\n <div class=\"tk-workspace-detail__device-status\">\r\n <span class=\"tk-workspace-detail__status-dot\"></span>\r\n Status unavailable\r\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-template #noDevices>\r\n <div class=\"tk-workspace-detail__empty\">No devices assigned.</div>\r\n </ng-template>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card\">\r\n <div class=\"tk-workspace-detail__card-header\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Calling</h2>\r\n <mat-icon class=\"tk-workspace-detail__settings-icon\">settings</mat-icon>\r\n </div>\r\n <div class=\"tk-workspace-detail__calling-license\">\r\n <mat-icon>call</mat-icon>\r\n {{ details.calling.license }}\r\n </div>\r\n <hr class=\"tk-workspace-detail__divider\" />\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Cisco Webex SIP Address</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.sipAddress }}</span>\r\n </div>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\" *ngIf=\"!details.schedulingConfigured\">\r\n <mat-icon class=\"tk-workspace-detail__card-icon\">event</mat-icon>\r\n <h3 class=\"tk-workspace-detail__card-heading\">Choose scheduling</h3>\r\n <p class=\"tk-workspace-detail__card-text\">Choose a calendar service or setup hot-desking for this workspace.</p>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Choose scheduling</button>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\">\r\n <mat-icon class=\"tk-workspace-detail__card-icon\">info</mat-icon>\r\n <h3 class=\"tk-workspace-detail__card-heading\">Device hosted meetings unavailable</h3>\r\n <p class=\"tk-workspace-detail__card-text\">Service not supported by Cisco IP phones</p>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card\">\r\n <h2 class=\"tk-workspace-detail__card-title\">\r\n Planned Maintenance\r\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\r\n </h2>\r\n <div class=\"tk-workspace-detail__row\">\r\n <mat-icon>build</mat-icon>\r\n <span>{{ details.plannedMaintenanceEnabled ? 'On' : 'Off' }}</span>\r\n </div>\r\n <hr class=\"tk-workspace-detail__divider\" />\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--with-action\">\r\n <div class=\"tk-workspace-detail__row\">\r\n <mat-icon>event</mat-icon>\r\n <div>\r\n <div>Schedule</div>\r\n <div class=\"tk-workspace-detail__row-hint\">No schedule set</div>\r\n </div>\r\n </div>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Edit schedule</button>\r\n </div>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\" *ngIf=\"!details.notes\">\r\n <mat-icon class=\"tk-workspace-detail__card-icon\">description</mat-icon>\r\n <h3 class=\"tk-workspace-detail__card-heading\">Add notes</h3>\r\n <p class=\"tk-workspace-detail__card-text\">Write a note about this workspace.</p>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add notes</button>\r\n </section>\r\n </div>\r\n\r\n <div class=\"tk-workspace-detail__col\">\r\n <section class=\"tk-workspace-detail__card\">\r\n <div class=\"tk-workspace-detail__card-header\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Location</h2>\r\n <mat-icon class=\"tk-workspace-detail__settings-icon\">settings</mat-icon>\r\n </div>\r\n <div class=\"tk-workspace-detail__location\">\r\n <mat-icon>location_on</mat-icon>\r\n <div>\r\n <a href=\"javascript:void(0)\" class=\"tk-workspace-detail__location-link\">{{ details.location.country }}</a>\r\n <div class=\"tk-workspace-detail__location-address\">{{ details.location.address }}</div>\r\n </div>\r\n </div>\r\n <hr class=\"tk-workspace-detail__divider\" />\r\n <div class=\"tk-workspace-detail__row\">\r\n <mat-icon>explore</mat-icon>\r\n <span>Indoor navigation</span>\r\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\r\n </div>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add URL</button>\r\n <div class=\"tk-workspace-detail__map\">\r\n <mat-icon class=\"tk-workspace-detail__map-pin\">location_on</mat-icon>\r\n </div>\r\n </section>\r\n </div>\r\n </div>\r\n\r\n <div class=\"tk-workspace-detail__grid\" *ngIf=\"activeTab === 'calling'\">\r\n <div class=\"tk-workspace-detail__col\">\r\n <section class=\"tk-workspace-detail__card\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Calling</h2>\r\n <div class=\"tk-workspace-detail__calling-license\">\r\n <mat-icon>call</mat-icon>\r\n {{ details.calling.license }}\r\n </div>\r\n <hr class=\"tk-workspace-detail__divider\" />\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Cisco Webex SIP Address</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.sipAddress }}</span>\r\n </div>\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Directory Number</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.directoryNumber }}</span>\r\n </div>\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Route Partition</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.routePartition }}</span>\r\n </div>\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Calling Search Space</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.callingSearchSpace }}</span>\r\n </div>\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Device Security Profile</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.securityProfile }}</span>\r\n </div>\r\n </section>\r\n </div>\r\n </div>\r\n</ng-container>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2;padding:1.5rem}.tk-workspace-detail__breadcrumb{display:inline-flex;align-items:center;gap:.125rem;padding:0;margin-bottom:1rem;background:none;border:none;font-family:inherit;font-size:.875rem;font-weight:500;color:#0009;cursor:pointer}.tk-workspace-detail__breadcrumb:hover{color:#000000f2}.tk-workspace-detail__breadcrumb mat-icon{font-size:1.25rem;height:1.25rem;width:1.25rem}.tk-workspace-detail__header{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1rem}.tk-workspace-detail__icon{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;flex-shrink:0;border-radius:50%;background:#2b2b2b}.tk-workspace-detail__icon img{height:1.375rem;width:1.375rem;filter:brightness(0) invert(1)}.tk-workspace-detail__title-block{flex:1;min-width:0}.tk-workspace-detail__name{margin:0 0 .375rem;font-size:1.25rem;font-weight:600}.tk-workspace-detail__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.375rem;font-size:.875rem;color:#0009}.tk-workspace-detail__meta-sep{color:#0000004d}.tk-workspace-detail__meta-icon{height:.875rem;width:.875rem;opacity:.4}.tk-workspace-detail__meta-muted{color:#0006}.tk-workspace-detail__actions-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#000;color:#fff;border:none;border-radius:6.25rem;font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;flex-shrink:0}.tk-workspace-detail__actions-button:hover{background:#2b2b2b}.tk-workspace-detail__actions-button mat-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__tabs{display:flex;align-items:center;gap:1.5rem;border-bottom:1px solid rgba(0,0,0,.12);margin-bottom:1.25rem}.tk-workspace-detail__tab{padding:.75rem 0;background:none;border:none;border-bottom:2px solid transparent;font-family:inherit;font-size:.9375rem;font-weight:500;color:#000000b3;cursor:pointer}.tk-workspace-detail__tab:hover{color:#000000f2}.tk-workspace-detail__tab--active{color:#000000f2;border-bottom-color:#000}.tk-workspace-detail__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem;align-items:start}@media (max-width: 900px){.tk-workspace-detail__grid{grid-template-columns:1fr}}.tk-workspace-detail__col{display:flex;flex-direction:column;gap:1.25rem;min-width:0}.tk-workspace-detail__card{background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;padding:1.25rem}.tk-workspace-detail__card--centered{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.375rem;padding:2rem 1.25rem}.tk-workspace-detail__card-icon{color:#0009;margin-bottom:.5rem}.tk-workspace-detail__card-heading{margin:0;font-size:.9375rem;font-weight:600}.tk-workspace-detail__card-text{margin:0 0 .5rem;font-size:.8125rem;color:#0009;max-width:20rem}.tk-workspace-detail__card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.tk-workspace-detail__card-title{display:flex;align-items:center;gap:.375rem;margin:0 0 .75rem;font-size:.9375rem;font-weight:600}.tk-workspace-detail__card-header .tk-workspace-detail__card-title{margin-bottom:0}.tk-workspace-detail__settings-icon,.tk-workspace-detail__info-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006}.tk-workspace-detail__divider{border:none;border-top:1px solid rgba(0,0,0,.12);margin:.75rem 0}.tk-workspace-detail__issue{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 0;border-top:1px solid rgba(0,0,0,.12)}.tk-workspace-detail__issue:first-of-type{border-top:none;padding-top:0}.tk-workspace-detail__issue-info{display:flex;align-items:flex-start;gap:.5rem}.tk-workspace-detail__issue-icon{color:#0353a8;font-size:1.125rem;height:1.125rem;width:1.125rem;margin-top:.125rem}.tk-workspace-detail__issue-message{font-size:.875rem;font-weight:500}.tk-workspace-detail__issue-timestamp{font-size:.75rem;color:#0006}.tk-workspace-detail__pill-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#fff;border:1px solid rgba(0,0,0,.3);border-radius:6.25rem;font-family:inherit;font-size:.8125rem;font-weight:500;color:#000000f2;cursor:pointer;white-space:nowrap}.tk-workspace-detail__pill-button:hover{background:#ededed}.tk-workspace-detail__pill-button mat-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__devices{display:flex;flex-wrap:wrap;gap:.75rem}.tk-workspace-detail__device{display:flex;align-items:center;gap:.625rem;padding:.75rem;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;min-width:12rem}.tk-workspace-detail__device-icon{width:2.25rem;height:auto;flex-shrink:0}.tk-workspace-detail__device-link{color:#0353a8;text-decoration:none;font-size:.875rem;font-weight:500}.tk-workspace-detail__device-status{display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:#0009}.tk-workspace-detail__empty{font-size:.875rem;color:#0009}.tk-workspace-detail__calling-license{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.tk-workspace-detail__calling-license mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__row{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.tk-workspace-detail__row mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem;flex-shrink:0}.tk-workspace-detail__row--with-action{justify-content:space-between}.tk-workspace-detail__row--kv{justify-content:space-between;padding:.5rem 0;border-top:1px solid rgba(0,0,0,.12)}.tk-workspace-detail__row--kv:first-of-type{border-top:none}.tk-workspace-detail__row-label{color:#0009}.tk-workspace-detail__row-value{font-weight:500;text-align:right}.tk-workspace-detail__row-hint{font-size:.75rem;color:#0006}.tk-workspace-detail__location{display:flex;align-items:flex-start;gap:.5rem}.tk-workspace-detail__location mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem;margin-top:.125rem}.tk-workspace-detail__location-link{color:#0353a8;text-decoration:none;font-size:.875rem;font-weight:500}.tk-workspace-detail__location-address{font-size:.8125rem;color:#0009}.tk-workspace-detail__map{display:flex;align-items:center;justify-content:center;height:12rem;margin-top:1rem;border-radius:.5rem;background:linear-gradient(135deg,#eef1e8 0%,#e4e9dc 100%)}.tk-workspace-detail__map-pin{color:#c73636;font-size:2rem;height:2rem;width:2rem}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] });
|
|
608
615
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WorkspaceDetailComponent, decorators: [{
|
|
609
616
|
type: Component,
|
|
610
|
-
args: [{ selector: 'tk-workspace-detail', template: "<button type=\"button\" class=\"tk-workspace-detail__breadcrumb\" (click)=\"onBack()\">\n <mat-icon>chevron_left</mat-icon>\n Workspaces\n</button>\n\n<div class=\"tk-workspace-detail__header\">\n <span class=\"tk-workspace-detail__icon\">\n <img src=\"assets/icons/device-in-room-regular.svg\" alt=\"\" />\n </span>\n <div class=\"tk-workspace-detail__title-block\">\n <h1 class=\"tk-workspace-detail__name\">{{ workspace.displayName }}</h1>\n <div class=\"tk-workspace-detail__meta\">\n <span class=\"tk-workspace-detail__status\">\n <span class=\"tk-workspace-detail__status-dot\"></span>\n Live status unavailable\n </span>\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\n <span>Type: {{ workspace.typeLabel === 'No type' ? 'Not set' : workspace.typeLabel }}</span>\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\n <img class=\"tk-workspace-detail__meta-icon\" src=\"assets/icons/people-regular.svg\" alt=\"\" />\n <span>Capacity: {{ workspace.capacity ?? 'Not set' }}</span>\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\n <span class=\"tk-workspace-detail__meta-muted\">Size not set</span>\n </div>\n </div>\n <button type=\"button\" class=\"tk-workspace-detail__actions-button\" [matMenuTriggerFor]=\"actionsMenu\">\n Actions\n <mat-icon>expand_more</mat-icon>\n </button>\n <mat-menu #actionsMenu=\"matMenu\">\n <button type=\"button\" mat-menu-item disabled>More actions coming soon</button>\n </mat-menu>\n</div>\n\n<nav class=\"tk-workspace-detail__tabs\">\n <button\n type=\"button\"\n class=\"tk-workspace-detail__tab\"\n [class.tk-workspace-detail__tab--active]=\"activeTab === 'overview'\"\n (click)=\"selectTab('overview')\">\n Overview\n </button>\n <button\n type=\"button\"\n class=\"tk-workspace-detail__tab\"\n [class.tk-workspace-detail__tab--active]=\"activeTab === 'calling'\"\n (click)=\"selectTab('calling')\">\n Calling\n </button>\n</nav>\n\n<ng-container *ngIf=\"details\">\n <div class=\"tk-workspace-detail__grid\" *ngIf=\"activeTab === 'overview'\">\n <div class=\"tk-workspace-detail__col\">\n <section class=\"tk-workspace-detail__card\" *ngIf=\"details.issues.length\">\n <h2 class=\"tk-workspace-detail__card-title\">Issues & Information</h2>\n <div class=\"tk-workspace-detail__issue\" *ngFor=\"let issue of details.issues\">\n <div class=\"tk-workspace-detail__issue-info\">\n <mat-icon class=\"tk-workspace-detail__issue-icon\">info</mat-icon>\n <div>\n <div class=\"tk-workspace-detail__issue-message\">{{ issue.message }}</div>\n <div class=\"tk-workspace-detail__issue-timestamp\">{{ issue.timestamp }}</div>\n </div>\n </div>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">\n {{ issue.actionLabel }}\n <mat-icon>expand_more</mat-icon>\n </button>\n </div>\n </section>\n\n <section class=\"tk-workspace-detail__card\">\n <div class=\"tk-workspace-detail__card-header\">\n <h2 class=\"tk-workspace-detail__card-title\">Devices</h2>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add device</button>\n </div>\n <div class=\"tk-workspace-detail__devices\" *ngIf=\"workspace.devices.length; else noDevices\">\n <div class=\"tk-workspace-detail__device\" *ngFor=\"let device of workspace.devices\">\n <img class=\"tk-workspace-detail__device-icon\" [src]=\"resolveIcon(device.model)\" [alt]=\"device.label\" />\n <div class=\"tk-workspace-detail__device-info\">\n <a href=\"javascript:void(0)\" class=\"tk-workspace-detail__device-link\">{{ device.label }}</a>\n <div class=\"tk-workspace-detail__device-status\">\n <span class=\"tk-workspace-detail__status-dot\"></span>\n Status unavailable\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\n </div>\n </div>\n </div>\n </div>\n <ng-template #noDevices>\n <div class=\"tk-workspace-detail__empty\">No devices assigned.</div>\n </ng-template>\n </section>\n\n <section class=\"tk-workspace-detail__card\">\n <div class=\"tk-workspace-detail__card-header\">\n <h2 class=\"tk-workspace-detail__card-title\">Calling</h2>\n <mat-icon class=\"tk-workspace-detail__settings-icon\">settings</mat-icon>\n </div>\n <div class=\"tk-workspace-detail__calling-license\">\n <mat-icon>call</mat-icon>\n {{ details.calling.license }}\n </div>\n <hr class=\"tk-workspace-detail__divider\" />\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Cisco Webex SIP Address</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.sipAddress }}</span>\n </div>\n </section>\n\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\" *ngIf=\"!details.schedulingConfigured\">\n <mat-icon class=\"tk-workspace-detail__card-icon\">event</mat-icon>\n <h3 class=\"tk-workspace-detail__card-heading\">Choose scheduling</h3>\n <p class=\"tk-workspace-detail__card-text\">Choose a calendar service or setup hot-desking for this workspace.</p>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Choose scheduling</button>\n </section>\n\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\">\n <mat-icon class=\"tk-workspace-detail__card-icon\">info</mat-icon>\n <h3 class=\"tk-workspace-detail__card-heading\">Device hosted meetings unavailable</h3>\n <p class=\"tk-workspace-detail__card-text\">Service not supported by Cisco IP phones</p>\n </section>\n\n <section class=\"tk-workspace-detail__card\">\n <h2 class=\"tk-workspace-detail__card-title\">\n Planned Maintenance\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\n </h2>\n <div class=\"tk-workspace-detail__row\">\n <mat-icon>build</mat-icon>\n <span>{{ details.plannedMaintenanceEnabled ? 'On' : 'Off' }}</span>\n </div>\n <hr class=\"tk-workspace-detail__divider\" />\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--with-action\">\n <div class=\"tk-workspace-detail__row\">\n <mat-icon>event</mat-icon>\n <div>\n <div>Schedule</div>\n <div class=\"tk-workspace-detail__row-hint\">No schedule set</div>\n </div>\n </div>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Edit schedule</button>\n </div>\n </section>\n\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\" *ngIf=\"!details.notes\">\n <mat-icon class=\"tk-workspace-detail__card-icon\">description</mat-icon>\n <h3 class=\"tk-workspace-detail__card-heading\">Add notes</h3>\n <p class=\"tk-workspace-detail__card-text\">Write a note about this workspace.</p>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add notes</button>\n </section>\n </div>\n\n <div class=\"tk-workspace-detail__col\">\n <section class=\"tk-workspace-detail__card\">\n <div class=\"tk-workspace-detail__card-header\">\n <h2 class=\"tk-workspace-detail__card-title\">Location</h2>\n <mat-icon class=\"tk-workspace-detail__settings-icon\">settings</mat-icon>\n </div>\n <div class=\"tk-workspace-detail__location\">\n <mat-icon>location_on</mat-icon>\n <div>\n <a href=\"javascript:void(0)\" class=\"tk-workspace-detail__location-link\">{{ details.location.country }}</a>\n <div class=\"tk-workspace-detail__location-address\">{{ details.location.address }}</div>\n </div>\n </div>\n <hr class=\"tk-workspace-detail__divider\" />\n <div class=\"tk-workspace-detail__row\">\n <mat-icon>explore</mat-icon>\n <span>Indoor navigation</span>\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\n </div>\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add URL</button>\n <div class=\"tk-workspace-detail__map\">\n <mat-icon class=\"tk-workspace-detail__map-pin\">location_on</mat-icon>\n </div>\n </section>\n </div>\n </div>\n\n <div class=\"tk-workspace-detail__grid\" *ngIf=\"activeTab === 'calling'\">\n <div class=\"tk-workspace-detail__col\">\n <section class=\"tk-workspace-detail__card\">\n <h2 class=\"tk-workspace-detail__card-title\">Calling</h2>\n <div class=\"tk-workspace-detail__calling-license\">\n <mat-icon>call</mat-icon>\n {{ details.calling.license }}\n </div>\n <hr class=\"tk-workspace-detail__divider\" />\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Cisco Webex SIP Address</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.sipAddress }}</span>\n </div>\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Directory Number</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.directoryNumber }}</span>\n </div>\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Route Partition</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.routePartition }}</span>\n </div>\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Calling Search Space</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.callingSearchSpace }}</span>\n </div>\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\n <span class=\"tk-workspace-detail__row-label\">Device Security Profile</span>\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.securityProfile }}</span>\n </div>\n </section>\n </div>\n </div>\n</ng-container>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2;padding:1.5rem}.tk-workspace-detail__breadcrumb{display:inline-flex;align-items:center;gap:.125rem;padding:0;margin-bottom:1rem;background:none;border:none;font-family:inherit;font-size:.875rem;font-weight:500;color:#0009;cursor:pointer}.tk-workspace-detail__breadcrumb:hover{color:#000000f2}.tk-workspace-detail__breadcrumb mat-icon{font-size:1.25rem;height:1.25rem;width:1.25rem}.tk-workspace-detail__header{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1rem}.tk-workspace-detail__icon{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;flex-shrink:0;border-radius:50%;background:#2b2b2b}.tk-workspace-detail__icon img{height:1.375rem;width:1.375rem;filter:brightness(0) invert(1)}.tk-workspace-detail__title-block{flex:1;min-width:0}.tk-workspace-detail__name{margin:0 0 .375rem;font-size:1.25rem;font-weight:600}.tk-workspace-detail__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.375rem;font-size:.875rem;color:#0009}.tk-workspace-detail__meta-sep{color:#0000004d}.tk-workspace-detail__meta-icon{height:.875rem;width:.875rem;opacity:.4}.tk-workspace-detail__meta-muted{color:#0006}.tk-workspace-detail__actions-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#000;color:#fff;border:none;border-radius:6.25rem;font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;flex-shrink:0}.tk-workspace-detail__actions-button:hover{background:#2b2b2b}.tk-workspace-detail__actions-button mat-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__tabs{display:flex;align-items:center;gap:1.5rem;border-bottom:1px solid rgba(0,0,0,.12);margin-bottom:1.25rem}.tk-workspace-detail__tab{padding:.75rem 0;background:none;border:none;border-bottom:2px solid transparent;font-family:inherit;font-size:.9375rem;font-weight:500;color:#000000b3;cursor:pointer}.tk-workspace-detail__tab:hover{color:#000000f2}.tk-workspace-detail__tab--active{color:#000000f2;border-bottom-color:#000}.tk-workspace-detail__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem;align-items:start}@media (max-width: 900px){.tk-workspace-detail__grid{grid-template-columns:1fr}}.tk-workspace-detail__col{display:flex;flex-direction:column;gap:1.25rem;min-width:0}.tk-workspace-detail__card{background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;padding:1.25rem}.tk-workspace-detail__card--centered{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.375rem;padding:2rem 1.25rem}.tk-workspace-detail__card-icon{color:#0009;margin-bottom:.5rem}.tk-workspace-detail__card-heading{margin:0;font-size:.9375rem;font-weight:600}.tk-workspace-detail__card-text{margin:0 0 .5rem;font-size:.8125rem;color:#0009;max-width:20rem}.tk-workspace-detail__card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.tk-workspace-detail__card-title{display:flex;align-items:center;gap:.375rem;margin:0 0 .75rem;font-size:.9375rem;font-weight:600}.tk-workspace-detail__card-header .tk-workspace-detail__card-title{margin-bottom:0}.tk-workspace-detail__settings-icon,.tk-workspace-detail__info-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006}.tk-workspace-detail__divider{border:none;border-top:1px solid rgba(0,0,0,.12);margin:.75rem 0}.tk-workspace-detail__issue{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 0;border-top:1px solid rgba(0,0,0,.12)}.tk-workspace-detail__issue:first-of-type{border-top:none;padding-top:0}.tk-workspace-detail__issue-info{display:flex;align-items:flex-start;gap:.5rem}.tk-workspace-detail__issue-icon{color:#0353a8;font-size:1.125rem;height:1.125rem;width:1.125rem;margin-top:.125rem}.tk-workspace-detail__issue-message{font-size:.875rem;font-weight:500}.tk-workspace-detail__issue-timestamp{font-size:.75rem;color:#0006}.tk-workspace-detail__pill-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#fff;border:1px solid rgba(0,0,0,.3);border-radius:6.25rem;font-family:inherit;font-size:.8125rem;font-weight:500;color:#000000f2;cursor:pointer;white-space:nowrap}.tk-workspace-detail__pill-button:hover{background:#ededed}.tk-workspace-detail__pill-button mat-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__devices{display:flex;flex-wrap:wrap;gap:.75rem}.tk-workspace-detail__device{display:flex;align-items:center;gap:.625rem;padding:.75rem;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;min-width:12rem}.tk-workspace-detail__device-icon{width:2.25rem;height:auto;flex-shrink:0}.tk-workspace-detail__device-link{color:#0353a8;text-decoration:none;font-size:.875rem;font-weight:500}.tk-workspace-detail__device-status{display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:#0009}.tk-workspace-detail__empty{font-size:.875rem;color:#0009}.tk-workspace-detail__calling-license{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.tk-workspace-detail__calling-license mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__row{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.tk-workspace-detail__row mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem;flex-shrink:0}.tk-workspace-detail__row--with-action{justify-content:space-between}.tk-workspace-detail__row--kv{justify-content:space-between;padding:.5rem 0;border-top:1px solid rgba(0,0,0,.12)}.tk-workspace-detail__row--kv:first-of-type{border-top:none}.tk-workspace-detail__row-label{color:#0009}.tk-workspace-detail__row-value{font-weight:500;text-align:right}.tk-workspace-detail__row-hint{font-size:.75rem;color:#0006}.tk-workspace-detail__location{display:flex;align-items:flex-start;gap:.5rem}.tk-workspace-detail__location mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem;margin-top:.125rem}.tk-workspace-detail__location-link{color:#0353a8;text-decoration:none;font-size:.875rem;font-weight:500}.tk-workspace-detail__location-address{font-size:.8125rem;color:#0009}.tk-workspace-detail__map{display:flex;align-items:center;justify-content:center;height:12rem;margin-top:1rem;border-radius:.5rem;background:linear-gradient(135deg,#eef1e8 0%,#e4e9dc 100%)}.tk-workspace-detail__map-pin{color:#c73636;font-size:2rem;height:2rem;width:2rem}\n"] }]
|
|
617
|
+
args: [{ selector: 'tk-workspace-detail', template: "<button type=\"button\" class=\"tk-workspace-detail__breadcrumb\" (click)=\"onBack()\">\r\n <mat-icon>chevron_left</mat-icon>\r\n Workspaces\r\n</button>\r\n\r\n<div class=\"tk-workspace-detail__header\">\r\n <span class=\"tk-workspace-detail__icon\">\r\n <img src=\"assets/icons/device-in-room-regular.svg\" alt=\"\" />\r\n </span>\r\n <div class=\"tk-workspace-detail__title-block\">\r\n <h1 class=\"tk-workspace-detail__name\">{{ workspace.displayName }}</h1>\r\n <div class=\"tk-workspace-detail__meta\">\r\n <span class=\"tk-workspace-detail__status\">\r\n <span class=\"tk-workspace-detail__status-dot\"></span>\r\n Live status unavailable\r\n </span>\r\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\r\n <span>Type: {{ workspace.typeLabel === 'No type' ? 'Not set' : workspace.typeLabel }}</span>\r\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\r\n <img class=\"tk-workspace-detail__meta-icon\" src=\"assets/icons/people-regular.svg\" alt=\"\" />\r\n <span>Capacity: {{ workspace.capacity ?? 'Not set' }}</span>\r\n <span class=\"tk-workspace-detail__meta-sep\">·</span>\r\n <span class=\"tk-workspace-detail__meta-muted\">Size not set</span>\r\n </div>\r\n </div>\r\n <button type=\"button\" class=\"tk-workspace-detail__actions-button\" [matMenuTriggerFor]=\"actionsMenu\">\r\n Actions\r\n <mat-icon>expand_more</mat-icon>\r\n </button>\r\n <mat-menu #actionsMenu=\"matMenu\">\r\n <button type=\"button\" mat-menu-item disabled>More actions coming soon</button>\r\n </mat-menu>\r\n</div>\r\n\r\n<nav class=\"tk-workspace-detail__tabs\">\r\n <button\r\n type=\"button\"\r\n class=\"tk-workspace-detail__tab\"\r\n [class.tk-workspace-detail__tab--active]=\"activeTab === 'overview'\"\r\n (click)=\"selectTab('overview')\">\r\n Overview\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"tk-workspace-detail__tab\"\r\n [class.tk-workspace-detail__tab--active]=\"activeTab === 'calling'\"\r\n (click)=\"selectTab('calling')\">\r\n Calling\r\n </button>\r\n</nav>\r\n\r\n<ng-container *ngIf=\"details\">\r\n <div class=\"tk-workspace-detail__grid\" *ngIf=\"activeTab === 'overview'\">\r\n <div class=\"tk-workspace-detail__col\">\r\n <section class=\"tk-workspace-detail__card\" *ngIf=\"details.issues.length\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Issues & Information</h2>\r\n <div class=\"tk-workspace-detail__issue\" *ngFor=\"let issue of details.issues\">\r\n <div class=\"tk-workspace-detail__issue-info\">\r\n <mat-icon class=\"tk-workspace-detail__issue-icon\">info</mat-icon>\r\n <div>\r\n <div class=\"tk-workspace-detail__issue-message\">{{ issue.message }}</div>\r\n <div class=\"tk-workspace-detail__issue-timestamp\">{{ issue.timestamp }}</div>\r\n </div>\r\n </div>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">\r\n {{ issue.actionLabel }}\r\n <mat-icon>expand_more</mat-icon>\r\n </button>\r\n </div>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card\">\r\n <div class=\"tk-workspace-detail__card-header\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Devices</h2>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add device</button>\r\n </div>\r\n <div class=\"tk-workspace-detail__devices\" *ngIf=\"workspace.devices.length; else noDevices\">\r\n <div class=\"tk-workspace-detail__device\" *ngFor=\"let device of workspace.devices\">\r\n <img class=\"tk-workspace-detail__device-icon\" [src]=\"resolveIcon(device.model)\" [alt]=\"device.label\" />\r\n <div class=\"tk-workspace-detail__device-info\">\r\n <a href=\"javascript:void(0)\" class=\"tk-workspace-detail__device-link\">{{ device.label }}</a>\r\n <div class=\"tk-workspace-detail__device-status\">\r\n <span class=\"tk-workspace-detail__status-dot\"></span>\r\n Status unavailable\r\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-template #noDevices>\r\n <div class=\"tk-workspace-detail__empty\">No devices assigned.</div>\r\n </ng-template>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card\">\r\n <div class=\"tk-workspace-detail__card-header\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Calling</h2>\r\n <mat-icon class=\"tk-workspace-detail__settings-icon\">settings</mat-icon>\r\n </div>\r\n <div class=\"tk-workspace-detail__calling-license\">\r\n <mat-icon>call</mat-icon>\r\n {{ details.calling.license }}\r\n </div>\r\n <hr class=\"tk-workspace-detail__divider\" />\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Cisco Webex SIP Address</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.sipAddress }}</span>\r\n </div>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\" *ngIf=\"!details.schedulingConfigured\">\r\n <mat-icon class=\"tk-workspace-detail__card-icon\">event</mat-icon>\r\n <h3 class=\"tk-workspace-detail__card-heading\">Choose scheduling</h3>\r\n <p class=\"tk-workspace-detail__card-text\">Choose a calendar service or setup hot-desking for this workspace.</p>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Choose scheduling</button>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\">\r\n <mat-icon class=\"tk-workspace-detail__card-icon\">info</mat-icon>\r\n <h3 class=\"tk-workspace-detail__card-heading\">Device hosted meetings unavailable</h3>\r\n <p class=\"tk-workspace-detail__card-text\">Service not supported by Cisco IP phones</p>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card\">\r\n <h2 class=\"tk-workspace-detail__card-title\">\r\n Planned Maintenance\r\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\r\n </h2>\r\n <div class=\"tk-workspace-detail__row\">\r\n <mat-icon>build</mat-icon>\r\n <span>{{ details.plannedMaintenanceEnabled ? 'On' : 'Off' }}</span>\r\n </div>\r\n <hr class=\"tk-workspace-detail__divider\" />\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--with-action\">\r\n <div class=\"tk-workspace-detail__row\">\r\n <mat-icon>event</mat-icon>\r\n <div>\r\n <div>Schedule</div>\r\n <div class=\"tk-workspace-detail__row-hint\">No schedule set</div>\r\n </div>\r\n </div>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Edit schedule</button>\r\n </div>\r\n </section>\r\n\r\n <section class=\"tk-workspace-detail__card tk-workspace-detail__card--centered\" *ngIf=\"!details.notes\">\r\n <mat-icon class=\"tk-workspace-detail__card-icon\">description</mat-icon>\r\n <h3 class=\"tk-workspace-detail__card-heading\">Add notes</h3>\r\n <p class=\"tk-workspace-detail__card-text\">Write a note about this workspace.</p>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add notes</button>\r\n </section>\r\n </div>\r\n\r\n <div class=\"tk-workspace-detail__col\">\r\n <section class=\"tk-workspace-detail__card\">\r\n <div class=\"tk-workspace-detail__card-header\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Location</h2>\r\n <mat-icon class=\"tk-workspace-detail__settings-icon\">settings</mat-icon>\r\n </div>\r\n <div class=\"tk-workspace-detail__location\">\r\n <mat-icon>location_on</mat-icon>\r\n <div>\r\n <a href=\"javascript:void(0)\" class=\"tk-workspace-detail__location-link\">{{ details.location.country }}</a>\r\n <div class=\"tk-workspace-detail__location-address\">{{ details.location.address }}</div>\r\n </div>\r\n </div>\r\n <hr class=\"tk-workspace-detail__divider\" />\r\n <div class=\"tk-workspace-detail__row\">\r\n <mat-icon>explore</mat-icon>\r\n <span>Indoor navigation</span>\r\n <mat-icon class=\"tk-workspace-detail__info-icon\">info_outline</mat-icon>\r\n </div>\r\n <button type=\"button\" class=\"tk-workspace-detail__pill-button\">Add URL</button>\r\n <div class=\"tk-workspace-detail__map\">\r\n <mat-icon class=\"tk-workspace-detail__map-pin\">location_on</mat-icon>\r\n </div>\r\n </section>\r\n </div>\r\n </div>\r\n\r\n <div class=\"tk-workspace-detail__grid\" *ngIf=\"activeTab === 'calling'\">\r\n <div class=\"tk-workspace-detail__col\">\r\n <section class=\"tk-workspace-detail__card\">\r\n <h2 class=\"tk-workspace-detail__card-title\">Calling</h2>\r\n <div class=\"tk-workspace-detail__calling-license\">\r\n <mat-icon>call</mat-icon>\r\n {{ details.calling.license }}\r\n </div>\r\n <hr class=\"tk-workspace-detail__divider\" />\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Cisco Webex SIP Address</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.sipAddress }}</span>\r\n </div>\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Directory Number</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.directoryNumber }}</span>\r\n </div>\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Route Partition</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.routePartition }}</span>\r\n </div>\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Calling Search Space</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.callingSearchSpace }}</span>\r\n </div>\r\n <div class=\"tk-workspace-detail__row tk-workspace-detail__row--kv\">\r\n <span class=\"tk-workspace-detail__row-label\">Device Security Profile</span>\r\n <span class=\"tk-workspace-detail__row-value\">{{ details.calling.securityProfile }}</span>\r\n </div>\r\n </section>\r\n </div>\r\n </div>\r\n</ng-container>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";:host{display:block;font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2;padding:1.5rem}.tk-workspace-detail__breadcrumb{display:inline-flex;align-items:center;gap:.125rem;padding:0;margin-bottom:1rem;background:none;border:none;font-family:inherit;font-size:.875rem;font-weight:500;color:#0009;cursor:pointer}.tk-workspace-detail__breadcrumb:hover{color:#000000f2}.tk-workspace-detail__breadcrumb mat-icon{font-size:1.25rem;height:1.25rem;width:1.25rem}.tk-workspace-detail__header{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1rem}.tk-workspace-detail__icon{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;flex-shrink:0;border-radius:50%;background:#2b2b2b}.tk-workspace-detail__icon img{height:1.375rem;width:1.375rem;filter:brightness(0) invert(1)}.tk-workspace-detail__title-block{flex:1;min-width:0}.tk-workspace-detail__name{margin:0 0 .375rem;font-size:1.25rem;font-weight:600}.tk-workspace-detail__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.375rem;font-size:.875rem;color:#0009}.tk-workspace-detail__meta-sep{color:#0000004d}.tk-workspace-detail__meta-icon{height:.875rem;width:.875rem;opacity:.4}.tk-workspace-detail__meta-muted{color:#0006}.tk-workspace-detail__actions-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#000;color:#fff;border:none;border-radius:6.25rem;font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;flex-shrink:0}.tk-workspace-detail__actions-button:hover{background:#2b2b2b}.tk-workspace-detail__actions-button mat-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__tabs{display:flex;align-items:center;gap:1.5rem;border-bottom:1px solid rgba(0,0,0,.12);margin-bottom:1.25rem}.tk-workspace-detail__tab{padding:.75rem 0;background:none;border:none;border-bottom:2px solid transparent;font-family:inherit;font-size:.9375rem;font-weight:500;color:#000000b3;cursor:pointer}.tk-workspace-detail__tab:hover{color:#000000f2}.tk-workspace-detail__tab--active{color:#000000f2;border-bottom-color:#000}.tk-workspace-detail__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem;align-items:start}@media (max-width: 900px){.tk-workspace-detail__grid{grid-template-columns:1fr}}.tk-workspace-detail__col{display:flex;flex-direction:column;gap:1.25rem;min-width:0}.tk-workspace-detail__card{background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;padding:1.25rem}.tk-workspace-detail__card--centered{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.375rem;padding:2rem 1.25rem}.tk-workspace-detail__card-icon{color:#0009;margin-bottom:.5rem}.tk-workspace-detail__card-heading{margin:0;font-size:.9375rem;font-weight:600}.tk-workspace-detail__card-text{margin:0 0 .5rem;font-size:.8125rem;color:#0009;max-width:20rem}.tk-workspace-detail__card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.tk-workspace-detail__card-title{display:flex;align-items:center;gap:.375rem;margin:0 0 .75rem;font-size:.9375rem;font-weight:600}.tk-workspace-detail__card-header .tk-workspace-detail__card-title{margin-bottom:0}.tk-workspace-detail__settings-icon,.tk-workspace-detail__info-icon{font-size:1.125rem;height:1.125rem;width:1.125rem;color:#0006}.tk-workspace-detail__divider{border:none;border-top:1px solid rgba(0,0,0,.12);margin:.75rem 0}.tk-workspace-detail__issue{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 0;border-top:1px solid rgba(0,0,0,.12)}.tk-workspace-detail__issue:first-of-type{border-top:none;padding-top:0}.tk-workspace-detail__issue-info{display:flex;align-items:flex-start;gap:.5rem}.tk-workspace-detail__issue-icon{color:#0353a8;font-size:1.125rem;height:1.125rem;width:1.125rem;margin-top:.125rem}.tk-workspace-detail__issue-message{font-size:.875rem;font-weight:500}.tk-workspace-detail__issue-timestamp{font-size:.75rem;color:#0006}.tk-workspace-detail__pill-button{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:#fff;border:1px solid rgba(0,0,0,.3);border-radius:6.25rem;font-family:inherit;font-size:.8125rem;font-weight:500;color:#000000f2;cursor:pointer;white-space:nowrap}.tk-workspace-detail__pill-button:hover{background:#ededed}.tk-workspace-detail__pill-button mat-icon{font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__devices{display:flex;flex-wrap:wrap;gap:.75rem}.tk-workspace-detail__device{display:flex;align-items:center;gap:.625rem;padding:.75rem;border:1px solid rgba(0,0,0,.12);border-radius:.5rem;min-width:12rem}.tk-workspace-detail__device-icon{width:2.25rem;height:auto;flex-shrink:0}.tk-workspace-detail__device-link{color:#0353a8;text-decoration:none;font-size:.875rem;font-weight:500}.tk-workspace-detail__device-status{display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:#0009}.tk-workspace-detail__empty{font-size:.875rem;color:#0009}.tk-workspace-detail__calling-license{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.tk-workspace-detail__calling-license mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem}.tk-workspace-detail__row{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.tk-workspace-detail__row mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem;flex-shrink:0}.tk-workspace-detail__row--with-action{justify-content:space-between}.tk-workspace-detail__row--kv{justify-content:space-between;padding:.5rem 0;border-top:1px solid rgba(0,0,0,.12)}.tk-workspace-detail__row--kv:first-of-type{border-top:none}.tk-workspace-detail__row-label{color:#0009}.tk-workspace-detail__row-value{font-weight:500;text-align:right}.tk-workspace-detail__row-hint{font-size:.75rem;color:#0006}.tk-workspace-detail__location{display:flex;align-items:flex-start;gap:.5rem}.tk-workspace-detail__location mat-icon{color:#0006;font-size:1.125rem;height:1.125rem;width:1.125rem;margin-top:.125rem}.tk-workspace-detail__location-link{color:#0353a8;text-decoration:none;font-size:.875rem;font-weight:500}.tk-workspace-detail__location-address{font-size:.8125rem;color:#0009}.tk-workspace-detail__map{display:flex;align-items:center;justify-content:center;height:12rem;margin-top:1rem;border-radius:.5rem;background:linear-gradient(135deg,#eef1e8 0%,#e4e9dc 100%)}.tk-workspace-detail__map-pin{color:#c73636;font-size:2rem;height:2rem;width:2rem}\n"] }]
|
|
611
618
|
}], ctorParameters: function () { return [{ type: WorkspaceDetailService }, { type: i2.Location }]; }, propDecorators: { workspace: [{
|
|
612
619
|
type: Input
|
|
620
|
+
}], connectionType: [{
|
|
621
|
+
type: Input
|
|
613
622
|
}], back: [{
|
|
614
623
|
type: Output
|
|
615
624
|
}] } });
|
|
@@ -619,10 +628,10 @@ class AppLoaderComponent {
|
|
|
619
628
|
}
|
|
620
629
|
}
|
|
621
630
|
AppLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AppLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
622
|
-
AppLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: AppLoaderComponent, selector: "app-loader", ngImport: i0, template: "<div class=\"overlay\">\n <mat-progress-spinner\n class=\"page-spinner\"\n mode=\"indeterminate\"\n [diameter]=\"70\"\n strokeWidth=\"3\"></mat-progress-spinner>\n</div>\n", styles: [".overlay{position:fixed;width:100%;height:100%;inset:0;background-color:#fff3;z-index:200}.mat-progress-spinner circle,.mat-spinner circle{stroke:#000!important}\n"], dependencies: [{ kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
631
|
+
AppLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: AppLoaderComponent, selector: "app-loader", ngImport: i0, template: "<div class=\"overlay\">\r\n <mat-progress-spinner\r\n class=\"page-spinner\"\r\n mode=\"indeterminate\"\r\n [diameter]=\"70\"\r\n strokeWidth=\"3\"></mat-progress-spinner>\r\n</div>\r\n", styles: [".overlay{position:fixed;width:100%;height:100%;inset:0;background-color:#fff3;z-index:200}.mat-progress-spinner circle,.mat-spinner circle{stroke:#000!important}\n"], dependencies: [{ kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
623
632
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AppLoaderComponent, decorators: [{
|
|
624
633
|
type: Component,
|
|
625
|
-
args: [{ selector: 'app-loader', encapsulation: ViewEncapsulation.None, template: "<div class=\"overlay\">\n <mat-progress-spinner\n class=\"page-spinner\"\n mode=\"indeterminate\"\n [diameter]=\"70\"\n strokeWidth=\"3\"></mat-progress-spinner>\n</div>\n", styles: [".overlay{position:fixed;width:100%;height:100%;inset:0;background-color:#fff3;z-index:200}.mat-progress-spinner circle,.mat-spinner circle{stroke:#000!important}\n"] }]
|
|
634
|
+
args: [{ selector: 'app-loader', encapsulation: ViewEncapsulation.None, template: "<div class=\"overlay\">\r\n <mat-progress-spinner\r\n class=\"page-spinner\"\r\n mode=\"indeterminate\"\r\n [diameter]=\"70\"\r\n strokeWidth=\"3\"></mat-progress-spinner>\r\n</div>\r\n", styles: [".overlay{position:fixed;width:100%;height:100%;inset:0;background-color:#fff3;z-index:200}.mat-progress-spinner circle,.mat-spinner circle{stroke:#000!important}\n"] }]
|
|
626
635
|
}], ctorParameters: function () { return []; } });
|
|
627
636
|
|
|
628
637
|
class WorkspacesComponent {
|
|
@@ -645,6 +654,7 @@ class WorkspacesComponent {
|
|
|
645
654
|
this.activeTab = 'workspaces';
|
|
646
655
|
this.view = 'list';
|
|
647
656
|
this.selectedWorkspace = null;
|
|
657
|
+
this.selectedConnectionType = 'di';
|
|
648
658
|
this.workspaces = [];
|
|
649
659
|
this.isLoading = false;
|
|
650
660
|
this.pageIndex = 0;
|
|
@@ -681,13 +691,14 @@ class WorkspacesComponent {
|
|
|
681
691
|
selectTab(tab) {
|
|
682
692
|
this.activeTab = tab;
|
|
683
693
|
}
|
|
684
|
-
onOpenWorkspace(id) {
|
|
694
|
+
onOpenWorkspace({ id, connectionType }) {
|
|
685
695
|
const workspace = this.workspaces.find(item => item.id === id) ?? null;
|
|
686
696
|
this.openWorkspace.emit(id);
|
|
687
697
|
if (!workspace) {
|
|
688
698
|
return;
|
|
689
699
|
}
|
|
690
700
|
this.selectedWorkspace = workspace;
|
|
701
|
+
this.selectedConnectionType = connectionType;
|
|
691
702
|
this.view = 'detail';
|
|
692
703
|
}
|
|
693
704
|
onBackToList() {
|
|
@@ -713,9 +724,9 @@ class WorkspacesComponent {
|
|
|
713
724
|
const dialogRef = this.dialog.open(WorkspaceConfirmDialogComponent, {
|
|
714
725
|
data: {
|
|
715
726
|
title: `Upgrade workspace ${workspace.displayName} to Multi Tenant?`,
|
|
716
|
-
message: `<p>Upgrading this workspace will prepare it for migration to Multi Tenant.</p>
|
|
717
|
-
<p>During this process, the workspace configuration will be copied to the Multi Tenant environment.
|
|
718
|
-
The workspace will remain active on the current system until the Activate step is completed.</p>
|
|
727
|
+
message: `<p>Upgrading this workspace will prepare it for migration to Multi Tenant.</p>
|
|
728
|
+
<p>During this process, the workspace configuration will be copied to the Multi Tenant environment.
|
|
729
|
+
The workspace will remain active on the current system until the Activate step is completed.</p>
|
|
719
730
|
<p>Do you want to continue?</p>`,
|
|
720
731
|
confirmButtonText: 'Yes, upgrade',
|
|
721
732
|
},
|
|
@@ -751,8 +762,8 @@ class WorkspacesComponent {
|
|
|
751
762
|
const dialogRef = this.dialog.open(WorkspaceConfirmDialogComponent, {
|
|
752
763
|
data: {
|
|
753
764
|
title: `Activate workspace ${workspace.displayName} on Multi Tenant?`,
|
|
754
|
-
message: `<p>Activating this workspace will perform the cutover to Multi Tenant and complete the migration process.</p>
|
|
755
|
-
<p>After activation, the workspace will become active on Multi Tenant and the original workspace will become inactive.</p>
|
|
765
|
+
message: `<p>Activating this workspace will perform the cutover to Multi Tenant and complete the migration process.</p>
|
|
766
|
+
<p>After activation, the workspace will become active on Multi Tenant and the original workspace will become inactive.</p>
|
|
756
767
|
<p>Do you want to continue?</p>`,
|
|
757
768
|
confirmButtonText: 'Activate',
|
|
758
769
|
},
|
|
@@ -763,7 +774,7 @@ class WorkspacesComponent {
|
|
|
763
774
|
}
|
|
764
775
|
this.pendingWorkspaceIds.add(workspace.id);
|
|
765
776
|
const subscription = this.migrationService
|
|
766
|
-
.getMigratedMigrationFormEntities(this.customerId, device.webexUUID, '
|
|
777
|
+
.getMigratedMigrationFormEntities(this.customerId, device.webexUUID, 'ORPHANED_DEVICE')
|
|
767
778
|
.pipe(map$1((entities) => (Array.isArray(entities) ? entities[0] : entities || null)))
|
|
768
779
|
.subscribe({
|
|
769
780
|
next: (entity) => {
|
|
@@ -857,10 +868,10 @@ class WorkspacesComponent {
|
|
|
857
868
|
if (!deviceMap[cucmId]) {
|
|
858
869
|
deviceMap[cucmId] = {};
|
|
859
870
|
}
|
|
860
|
-
if (!deviceMap[cucmId]['
|
|
861
|
-
deviceMap[cucmId]['
|
|
871
|
+
if (!deviceMap[cucmId]['ORPHANED_DEVICE']) {
|
|
872
|
+
deviceMap[cucmId]['ORPHANED_DEVICE'] = [];
|
|
862
873
|
}
|
|
863
|
-
deviceMap[cucmId]['
|
|
874
|
+
deviceMap[cucmId]['ORPHANED_DEVICE'].push(deviceName);
|
|
864
875
|
});
|
|
865
876
|
return deviceMap;
|
|
866
877
|
}
|
|
@@ -888,10 +899,10 @@ class WorkspacesComponent {
|
|
|
888
899
|
}
|
|
889
900
|
}
|
|
890
901
|
WorkspacesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WorkspacesComponent, deps: [{ token: APIService }, { token: ApiWebexService }, { token: WorkspacesService }, { token: WorkspacesMigrationService }, { token: i1.MatDialog }, { token: i2.Location }], target: i0.ɵɵFactoryTarget.Component });
|
|
891
|
-
WorkspacesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WorkspacesComponent, selector: "tk-workspaces", inputs: { host: "host", token: "token", customerId: "customerId" }, outputs: { addWorkspace: "addWorkspace", openWorkspace: "openWorkspace", addDevice: "addDevice" }, ngImport: i0, template: "<div class=\"tk-workspaces\">\n <ng-container *ngIf=\"view === 'list'; else detailView\">\n <header class=\"tk-workspaces__header\">\n <h1 class=\"tk-workspaces__title\">Workspaces</h1>\n </header>\n\n <nav class=\"tk-workspaces__tabs\">\n <button\n type=\"button\"\n *ngFor=\"let tab of tabs\"\n class=\"tk-workspaces__tab\"\n [class.tk-workspaces__tab--active]=\"activeTab === tab.id\"\n (click)=\"selectTab(tab.id)\">\n <img class=\"tk-workspaces__tab-icon\" [src]=\"tab.icon\" alt=\"\" />\n {{ tab.label }}\n </button>\n </nav>\n\n <ng-container *ngIf=\"activeTab === 'workspaces'; else placeholder\">\n <app-loader *ngIf=\"isLoading\"></app-loader>\n\n <tk-workspaces-filters\n [resultCount]=\"total\"\n [typeOptions]=\"typeOptions\"\n [locationOptions]=\"locationOptions\"\n (searchChange)=\"onSearchChange($event)\"\n (typeChange)=\"onTypeFilterChange($event)\"\n (locationChange)=\"onLocationFilterChange($event)\"\n (addWorkspace)=\"addWorkspace.emit()\">\n </tk-workspaces-filters>\n\n <tk-workspaces-table\n [workspaces]=\"filteredWorkspaces\"\n [total]=\"total\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [pendingWorkspaceIds]=\"pendingWorkspaceIds\"\n (openWorkspace)=\"onOpenWorkspace($event)\"\n (licenseWithHybrid)=\"onMoveToMT($event)\"\n (migrateToMT)=\"onMoveToMT($event)\"\n (enableWebexCalling)=\"onEnableWebexCalling($event)\"\n (migrateToUCM)=\"onMigrateToUCM($event)\"\n (addDevice)=\"addDevice.emit($event)\"\n (pageChange)=\"onPageChange($event)\">\n </tk-workspaces-table>\n </ng-container>\n\n <ng-template #placeholder>\n <div class=\"tk-workspaces__placeholder\">This section isn't available in this widget yet.</div>\n </ng-template>\n </ng-container>\n\n <ng-template #detailView>\n <tk-workspace-detail\n *ngIf=\"selectedWorkspace\"\n [workspace]=\"selectedWorkspace\"\n (back)=\"onBackToList()\">\n </tk-workspace-detail>\n </ng-template>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";.tk-workspaces{font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2;padding:1.5rem}.tk-workspaces__header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding-bottom:1rem}.tk-workspaces__title{margin:0;font-size:1.5rem;font-weight:600}.tk-workspaces__tabs{display:flex;align-items:center;gap:.25rem;margin-bottom:1rem}.tk-workspaces__tab{display:inline-flex;align-items:center;gap:.375rem;padding:.5rem .875rem;background:none;border:none;border-radius:6.25rem;font-family:inherit;font-size:1rem;font-weight:500;color:#000000b3;cursor:pointer}.tk-workspaces__tab:hover{background:rgba(0,0,0,.0705882353)}.tk-workspaces__tab--active{background:#C1C1C1;color:#000000f2}.tk-workspaces__tab--active:hover{background:rgba(0,0,0,.3019607843)}.tk-workspaces__tab-icon{height:1.125rem;width:1.125rem;opacity:.6}.tk-workspaces__tab--active .tk-workspaces__tab-icon{opacity:1}.tk-workspaces__placeholder{padding:3rem 1rem;text-align:center;color:#0009}::ng-deep input.blue-input{border:solid .0625rem rgba(0,0,0,.5019607843)!important}::ng-deep input.blue-input:focus{display:flex;align-items:center;color:#000000b3;background-color:#ededed;border:solid .0625rem rgba(0,0,0,.5019607843);font-weight:500;cursor:pointer;flex-wrap:wrap;gap:.5rem;box-shadow:0 0 0 .12rem #fff,0 0 0 .25rem #1170cf,0 0 0 .3rem #1170cf59;background-color:#fff!important}::ng-deep input.blue-input:focus:focus-visible{outline:none}::ng-deep input.blue-input:hover{background-color:#00000012!important}.data-loader{position:absolute;top:calc(50% - 25px);left:calc(50% - 25px)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WorkspacesFiltersComponent, selector: "tk-workspaces-filters", inputs: ["resultCount", "typeOptions", "locationOptions"], outputs: ["searchChange", "typeChange", "locationChange", "addWorkspace"] }, { kind: "component", type: WorkspacesTableComponent, selector: "tk-workspaces-table", inputs: ["workspaces", "total", "pageIndex", "pageSize", "pageSizeOptions", "pendingWorkspaceIds"], outputs: ["openWorkspace", "licenseWithHybrid", "migrateToMT", "enableWebexCalling", "migrateToUCM", "addDevice", "pageChange"] }, { kind: "component", type: WorkspaceDetailComponent, selector: "tk-workspace-detail", inputs: ["workspace"], outputs: ["back"] }, { kind: "component", type: AppLoaderComponent, selector: "app-loader" }] });
|
|
902
|
+
WorkspacesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WorkspacesComponent, selector: "tk-workspaces", inputs: { host: "host", token: "token", customerId: "customerId" }, outputs: { addWorkspace: "addWorkspace", openWorkspace: "openWorkspace", addDevice: "addDevice" }, ngImport: i0, template: "<div class=\"tk-workspaces\">\r\n <ng-container *ngIf=\"view === 'list'; else detailView\">\r\n <header class=\"tk-workspaces__header\">\r\n <h1 class=\"tk-workspaces__title\">Workspaces</h1>\r\n </header>\r\n\r\n <nav class=\"tk-workspaces__tabs\">\r\n <button\r\n type=\"button\"\r\n *ngFor=\"let tab of tabs\"\r\n class=\"tk-workspaces__tab\"\r\n [class.tk-workspaces__tab--active]=\"activeTab === tab.id\"\r\n (click)=\"selectTab(tab.id)\">\r\n <img class=\"tk-workspaces__tab-icon\" [src]=\"tab.icon\" alt=\"\" />\r\n {{ tab.label }}\r\n </button>\r\n </nav>\r\n\r\n <ng-container *ngIf=\"activeTab === 'workspaces'; else placeholder\">\r\n <app-loader *ngIf=\"isLoading\"></app-loader>\r\n\r\n <tk-workspaces-filters\r\n [resultCount]=\"total\"\r\n [typeOptions]=\"typeOptions\"\r\n [locationOptions]=\"locationOptions\"\r\n (searchChange)=\"onSearchChange($event)\"\r\n (typeChange)=\"onTypeFilterChange($event)\"\r\n (locationChange)=\"onLocationFilterChange($event)\"\r\n (addWorkspace)=\"addWorkspace.emit()\">\r\n </tk-workspaces-filters>\r\n\r\n <tk-workspaces-table\r\n [workspaces]=\"filteredWorkspaces\"\r\n [total]=\"total\"\r\n [pageIndex]=\"pageIndex\"\r\n [pageSize]=\"pageSize\"\r\n [pendingWorkspaceIds]=\"pendingWorkspaceIds\"\r\n (openWorkspace)=\"onOpenWorkspace($event)\"\r\n (licenseWithHybrid)=\"onMoveToMT($event)\"\r\n (migrateToMT)=\"onMoveToMT($event)\"\r\n (enableWebexCalling)=\"onEnableWebexCalling($event)\"\r\n (migrateToUCM)=\"onMigrateToUCM($event)\"\r\n (addDevice)=\"addDevice.emit($event)\"\r\n (pageChange)=\"onPageChange($event)\">\r\n </tk-workspaces-table>\r\n </ng-container>\r\n\r\n <ng-template #placeholder>\r\n <div class=\"tk-workspaces__placeholder\">This section isn't available in this widget yet.</div>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #detailView>\r\n <tk-workspace-detail\r\n *ngIf=\"selectedWorkspace\"\r\n [workspace]=\"selectedWorkspace\"\r\n [connectionType]=\"selectedConnectionType\"\r\n (back)=\"onBackToList()\">\r\n </tk-workspace-detail>\r\n </ng-template>\r\n</div>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";.tk-workspaces{font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2;padding:1.5rem}.tk-workspaces__header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding-bottom:1rem}.tk-workspaces__title{margin:0;font-size:1.5rem;font-weight:600}.tk-workspaces__tabs{display:flex;align-items:center;gap:.25rem;margin-bottom:1rem}.tk-workspaces__tab{display:inline-flex;align-items:center;gap:.375rem;padding:.5rem .875rem;background:none;border:none;border-radius:6.25rem;font-family:inherit;font-size:1rem;font-weight:500;color:#000000b3;cursor:pointer}.tk-workspaces__tab:hover{background:rgba(0,0,0,.0705882353)}.tk-workspaces__tab--active{background:#C1C1C1;color:#000000f2}.tk-workspaces__tab--active:hover{background:rgba(0,0,0,.3019607843)}.tk-workspaces__tab-icon{height:1.125rem;width:1.125rem;opacity:.6}.tk-workspaces__tab--active .tk-workspaces__tab-icon{opacity:1}.tk-workspaces__placeholder{padding:3rem 1rem;text-align:center;color:#0009}::ng-deep input.blue-input{border:solid .0625rem rgba(0,0,0,.5019607843)!important}::ng-deep input.blue-input:focus{display:flex;align-items:center;color:#000000b3;background-color:#ededed;border:solid .0625rem rgba(0,0,0,.5019607843);font-weight:500;cursor:pointer;flex-wrap:wrap;gap:.5rem;box-shadow:0 0 0 .12rem #fff,0 0 0 .25rem #1170cf,0 0 0 .3rem #1170cf59;background-color:#fff!important}::ng-deep input.blue-input:focus:focus-visible{outline:none}::ng-deep input.blue-input:hover{background-color:#00000012!important}.data-loader{position:absolute;top:calc(50% - 25px);left:calc(50% - 25px)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WorkspacesFiltersComponent, selector: "tk-workspaces-filters", inputs: ["resultCount", "typeOptions", "locationOptions"], outputs: ["searchChange", "typeChange", "locationChange", "addWorkspace"] }, { kind: "component", type: WorkspacesTableComponent, selector: "tk-workspaces-table", inputs: ["workspaces", "total", "pageIndex", "pageSize", "pageSizeOptions", "pendingWorkspaceIds"], outputs: ["openWorkspace", "licenseWithHybrid", "migrateToMT", "enableWebexCalling", "migrateToUCM", "addDevice", "pageChange"] }, { kind: "component", type: WorkspaceDetailComponent, selector: "tk-workspace-detail", inputs: ["workspace", "connectionType"], outputs: ["back"] }, { kind: "component", type: AppLoaderComponent, selector: "app-loader" }] });
|
|
892
903
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WorkspacesComponent, decorators: [{
|
|
893
904
|
type: Component,
|
|
894
|
-
args: [{ selector: 'tk-workspaces', template: "<div class=\"tk-workspaces\">\n <ng-container *ngIf=\"view === 'list'; else detailView\">\n <header class=\"tk-workspaces__header\">\n <h1 class=\"tk-workspaces__title\">Workspaces</h1>\n </header>\n\n <nav class=\"tk-workspaces__tabs\">\n <button\n type=\"button\"\n *ngFor=\"let tab of tabs\"\n class=\"tk-workspaces__tab\"\n [class.tk-workspaces__tab--active]=\"activeTab === tab.id\"\n (click)=\"selectTab(tab.id)\">\n <img class=\"tk-workspaces__tab-icon\" [src]=\"tab.icon\" alt=\"\" />\n {{ tab.label }}\n </button>\n </nav>\n\n <ng-container *ngIf=\"activeTab === 'workspaces'; else placeholder\">\n <app-loader *ngIf=\"isLoading\"></app-loader>\n\n <tk-workspaces-filters\n [resultCount]=\"total\"\n [typeOptions]=\"typeOptions\"\n [locationOptions]=\"locationOptions\"\n (searchChange)=\"onSearchChange($event)\"\n (typeChange)=\"onTypeFilterChange($event)\"\n (locationChange)=\"onLocationFilterChange($event)\"\n (addWorkspace)=\"addWorkspace.emit()\">\n </tk-workspaces-filters>\n\n <tk-workspaces-table\n [workspaces]=\"filteredWorkspaces\"\n [total]=\"total\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [pendingWorkspaceIds]=\"pendingWorkspaceIds\"\n (openWorkspace)=\"onOpenWorkspace($event)\"\n (licenseWithHybrid)=\"onMoveToMT($event)\"\n (migrateToMT)=\"onMoveToMT($event)\"\n (enableWebexCalling)=\"onEnableWebexCalling($event)\"\n (migrateToUCM)=\"onMigrateToUCM($event)\"\n (addDevice)=\"addDevice.emit($event)\"\n (pageChange)=\"onPageChange($event)\">\n </tk-workspaces-table>\n </ng-container>\n\n <ng-template #placeholder>\n <div class=\"tk-workspaces__placeholder\">This section isn't available in this widget yet.</div>\n </ng-template>\n </ng-container>\n\n <ng-template #detailView>\n <tk-workspace-detail\n *ngIf=\"selectedWorkspace\"\n [workspace]=\"selectedWorkspace\"\n (back)=\"onBackToList()\">\n </tk-workspace-detail>\n </ng-template>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";.tk-workspaces{font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2;padding:1.5rem}.tk-workspaces__header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding-bottom:1rem}.tk-workspaces__title{margin:0;font-size:1.5rem;font-weight:600}.tk-workspaces__tabs{display:flex;align-items:center;gap:.25rem;margin-bottom:1rem}.tk-workspaces__tab{display:inline-flex;align-items:center;gap:.375rem;padding:.5rem .875rem;background:none;border:none;border-radius:6.25rem;font-family:inherit;font-size:1rem;font-weight:500;color:#000000b3;cursor:pointer}.tk-workspaces__tab:hover{background:rgba(0,0,0,.0705882353)}.tk-workspaces__tab--active{background:#C1C1C1;color:#000000f2}.tk-workspaces__tab--active:hover{background:rgba(0,0,0,.3019607843)}.tk-workspaces__tab-icon{height:1.125rem;width:1.125rem;opacity:.6}.tk-workspaces__tab--active .tk-workspaces__tab-icon{opacity:1}.tk-workspaces__placeholder{padding:3rem 1rem;text-align:center;color:#0009}::ng-deep input.blue-input{border:solid .0625rem rgba(0,0,0,.5019607843)!important}::ng-deep input.blue-input:focus{display:flex;align-items:center;color:#000000b3;background-color:#ededed;border:solid .0625rem rgba(0,0,0,.5019607843);font-weight:500;cursor:pointer;flex-wrap:wrap;gap:.5rem;box-shadow:0 0 0 .12rem #fff,0 0 0 .25rem #1170cf,0 0 0 .3rem #1170cf59;background-color:#fff!important}::ng-deep input.blue-input:focus:focus-visible{outline:none}::ng-deep input.blue-input:hover{background-color:#00000012!important}.data-loader{position:absolute;top:calc(50% - 25px);left:calc(50% - 25px)}\n"] }]
|
|
905
|
+
args: [{ selector: 'tk-workspaces', template: "<div class=\"tk-workspaces\">\r\n <ng-container *ngIf=\"view === 'list'; else detailView\">\r\n <header class=\"tk-workspaces__header\">\r\n <h1 class=\"tk-workspaces__title\">Workspaces</h1>\r\n </header>\r\n\r\n <nav class=\"tk-workspaces__tabs\">\r\n <button\r\n type=\"button\"\r\n *ngFor=\"let tab of tabs\"\r\n class=\"tk-workspaces__tab\"\r\n [class.tk-workspaces__tab--active]=\"activeTab === tab.id\"\r\n (click)=\"selectTab(tab.id)\">\r\n <img class=\"tk-workspaces__tab-icon\" [src]=\"tab.icon\" alt=\"\" />\r\n {{ tab.label }}\r\n </button>\r\n </nav>\r\n\r\n <ng-container *ngIf=\"activeTab === 'workspaces'; else placeholder\">\r\n <app-loader *ngIf=\"isLoading\"></app-loader>\r\n\r\n <tk-workspaces-filters\r\n [resultCount]=\"total\"\r\n [typeOptions]=\"typeOptions\"\r\n [locationOptions]=\"locationOptions\"\r\n (searchChange)=\"onSearchChange($event)\"\r\n (typeChange)=\"onTypeFilterChange($event)\"\r\n (locationChange)=\"onLocationFilterChange($event)\"\r\n (addWorkspace)=\"addWorkspace.emit()\">\r\n </tk-workspaces-filters>\r\n\r\n <tk-workspaces-table\r\n [workspaces]=\"filteredWorkspaces\"\r\n [total]=\"total\"\r\n [pageIndex]=\"pageIndex\"\r\n [pageSize]=\"pageSize\"\r\n [pendingWorkspaceIds]=\"pendingWorkspaceIds\"\r\n (openWorkspace)=\"onOpenWorkspace($event)\"\r\n (licenseWithHybrid)=\"onMoveToMT($event)\"\r\n (migrateToMT)=\"onMoveToMT($event)\"\r\n (enableWebexCalling)=\"onEnableWebexCalling($event)\"\r\n (migrateToUCM)=\"onMigrateToUCM($event)\"\r\n (addDevice)=\"addDevice.emit($event)\"\r\n (pageChange)=\"onPageChange($event)\">\r\n </tk-workspaces-table>\r\n </ng-container>\r\n\r\n <ng-template #placeholder>\r\n <div class=\"tk-workspaces__placeholder\">This section isn't available in this widget yet.</div>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #detailView>\r\n <tk-workspace-detail\r\n *ngIf=\"selectedWorkspace\"\r\n [workspace]=\"selectedWorkspace\"\r\n [connectionType]=\"selectedConnectionType\"\r\n (back)=\"onBackToList()\">\r\n </tk-workspace-detail>\r\n </ng-template>\r\n</div>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap\";.tk-workspaces{font-family:Inter,Helvetica Neue,Helvetica,Arial,sans-serif;color:#000000f2;padding:1.5rem}.tk-workspaces__header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding-bottom:1rem}.tk-workspaces__title{margin:0;font-size:1.5rem;font-weight:600}.tk-workspaces__tabs{display:flex;align-items:center;gap:.25rem;margin-bottom:1rem}.tk-workspaces__tab{display:inline-flex;align-items:center;gap:.375rem;padding:.5rem .875rem;background:none;border:none;border-radius:6.25rem;font-family:inherit;font-size:1rem;font-weight:500;color:#000000b3;cursor:pointer}.tk-workspaces__tab:hover{background:rgba(0,0,0,.0705882353)}.tk-workspaces__tab--active{background:#C1C1C1;color:#000000f2}.tk-workspaces__tab--active:hover{background:rgba(0,0,0,.3019607843)}.tk-workspaces__tab-icon{height:1.125rem;width:1.125rem;opacity:.6}.tk-workspaces__tab--active .tk-workspaces__tab-icon{opacity:1}.tk-workspaces__placeholder{padding:3rem 1rem;text-align:center;color:#0009}::ng-deep input.blue-input{border:solid .0625rem rgba(0,0,0,.5019607843)!important}::ng-deep input.blue-input:focus{display:flex;align-items:center;color:#000000b3;background-color:#ededed;border:solid .0625rem rgba(0,0,0,.5019607843);font-weight:500;cursor:pointer;flex-wrap:wrap;gap:.5rem;box-shadow:0 0 0 .12rem #fff,0 0 0 .25rem #1170cf,0 0 0 .3rem #1170cf59;background-color:#fff!important}::ng-deep input.blue-input:focus:focus-visible{outline:none}::ng-deep input.blue-input:hover{background-color:#00000012!important}.data-loader{position:absolute;top:calc(50% - 25px);left:calc(50% - 25px)}\n"] }]
|
|
895
906
|
}], ctorParameters: function () { return [{ type: APIService }, { type: ApiWebexService }, { type: WorkspacesService }, { type: WorkspacesMigrationService }, { type: i1.MatDialog }, { type: i2.Location }]; }, propDecorators: { host: [{
|
|
896
907
|
type: Input
|
|
897
908
|
}], token: [{
|