Merge pull request 'Refactoring solo pages into a modules' (#19) from tsdoc into development
Release / release (push) Failing after 2m2s Details
Build / Build-and-ng-test (pull_request) Successful in 24s Details

Reviewed-on: #19
Reviewed-by: allan <allan@4gl.io>
This commit is contained in:
allan 2023-08-25 11:24:10 +00:00
commit 93f1b81d70
76 changed files with 4181 additions and 471 deletions

View File

@ -97,8 +97,8 @@ jobs:
run: |
cd client
npm -g install cloudron-surfer
npm run typedoc
surfer put --token ${{ secrets.TSDOC_TOKEN }} --server tsdoc.datacontroller.io ../tsdoc /
npm run compodoc:build
surfer put --token ${{ secrets.TSDOC_TOKEN }} --server webdoc.datacontroller.io documentation/* /
- name: Upload assets to release
run: |

1
.gitignore vendored
View File

@ -10,6 +10,7 @@ client/src/environments/version.ts
client/cypress/screenshots
client/cypress/results
client/cypress/videos
client/documentation
cypress.env.json
sasjsbuild
sasjsresults

3442
client/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,6 +1,6 @@
{
"name": "dc-client",
"description": "dc-client",
"name": "data_controller-client",
"description": "DataController Client",
"angular-cli": {},
"scripts": {
"start": "node --max_old_space_size=4096 node_modules/@angular/cli/bin/ng serve",
@ -29,7 +29,9 @@
"cy:run": "cypress run",
"audit:prod": "npm audit --omit=dev",
"sasdocs": "sasjs doc && ./sasjs/utils/deploydocs.sh",
"typedoc": "typedoc --options typedoc.json && cd ../tsdoc"
"compodoc:build": "compodoc -p tsconfig.doc.json --name 'Data Controller Client'",
"compodoc:build-and-serve": "compodoc -p tsconfig.doc.json -s --name 'Data Controller Client'",
"compodoc:serve": "compodoc -s --name 'Data Controller Client'"
},
"private": true,
"dependencies": {
@ -87,6 +89,8 @@
"@angular-eslint/template-parser": "16.0.3",
"@angular/cli": "^16.1.0",
"@angular/compiler-cli": "^16.1.2",
"@babel/plugin-proposal-private-methods": "^7.18.6",
"@compodoc/compodoc": "^1.1.21",
"@cypress/webpack-preprocessor": "^5.17.1",
"@types/core-js": "^2.5.5",
"@types/crypto-js": "^4.0.1",
@ -119,9 +123,10 @@
"rimraf": "3.0.2",
"ts-loader": "^9.2.8",
"ts-node": "^3.3.0",
"typedoc": "^0.23.24",
"typedoc": "^0.24.8",
"typedoc-plugin-external-module-name": "^4.0.6",
"typescript": "~4.9.4",
"wait-on": "^6.0.1",
"watch": "^1.0.2"
}
}
}

View File

@ -1,5 +1,8 @@
import { QueryClause } from './models/TableData'
/**
* Filtering cache info, to be reused when filtering modal is re-open
*/
interface FilterCache {
cols: any[]
vals: any[]
@ -10,12 +13,18 @@ interface FilterCache {
query: QueryClause[]
}
/**
* Filtering cache info in the open viewboxes, to be reused when filtering modal is re-open
*/
interface ViewboxCache {
[key: number]: {
filter: FilterCache
}
}
/**
* Initial values when no cached values stored
*/
export const initFilter: { filter: FilterCache } = {
filter: {
cols: <any[]>[],
@ -28,6 +37,13 @@ export const initFilter: { filter: FilterCache } = {
}
}
/**
* Cached filtering values across whole app (editor, viewer, viewboxes)
* Cached lineage libraries, tables
* Cached metadata tree
* Cached usernav tree
* Cached viyaApi collections, search and selected endpoint
*/
export const globals: {
rootParam: string
editor: any

View File

@ -1,40 +0,0 @@
<div class="content-area">
<div class="card">
<div class="card-header d-flex flex-column justify-content-center">
<h3 class="text-center">
You succesfully edited table
<span class="color-blue font-weight-700">{{ libds }}</span>
</h3>
<p class="text-center">
<b>Please choose from the following actions</b>
</p>
<div class="row d-flex justify-content-center mt-20">
<button
class="btn btn-sm btn-outline text-center"
(click)="submittedTableScreen()"
>
Go to submitted table screen
</button>
<button
class="btn btn-sm btn-outline text-center"
(click)="viewerTableScreen()"
>
Go to base table screen
</button>
<button
id="approvalBtn"
class="btn btn-sm btn-success-outline text-center"
(click)="approveTableScreen()"
>
Go to approvals screen
</button>
<button
class="btn btn-sm btn-info-outline text-center"
(click)="goBack()"
>
Go back to editor
</button>
</div>
</div>
</div>
</div>

View File

@ -1,50 +0,0 @@
import { AfterViewInit, Component, OnInit } from '@angular/core'
import { ActivatedRoute, Router } from '@angular/router'
@Component({
selector: 'app-actions',
templateUrl: './actions.component.html',
styleUrls: ['./actions.component.scss'],
host: {
class: 'content-container'
}
})
export class ActionsComponent implements OnInit, AfterViewInit {
public dsid: any
public libds: string | undefined
constructor(
private route: ActivatedRoute,
private router: Router
) {}
public submittedTableScreen() {
this.router.navigateByUrl('/stage/' + this.dsid)
}
public approveTableScreen() {
this.router.navigateByUrl('/approve/approveDet/' + this.dsid)
}
public viewerTableScreen() {
this.router.navigateByUrl('/view/data/' + this.libds)
}
public goBack() {
this.router.navigateByUrl('/editor/' + this.libds)
}
async ngOnInit() {
this.dsid = this.route.snapshot.params['dsid']
this.libds = this.route.snapshot.params['libds']
}
ngAfterViewInit() {
setTimeout(() => {
let approvalBtn: any = window.document.getElementById('approvalBtn')
if (!!approvalBtn) {
approvalBtn.focus()
}
}, 700)
}
}

View File

@ -169,7 +169,7 @@
<clr-dropdown-menu *clrIfOpen clrPosition="bottom-left">
<a [routerLink]="['/view']" clrDropdownItem>VIEW</a>
<a [routerLink]="['/home']" clrDropdownItem>EDIT</a>
<a [routerLink]="['/submitted']" clrDropdownItem>REVIEW</a>
<a [routerLink]="['/review/submitted']" clrDropdownItem>REVIEW</a>
</clr-dropdown-menu>
</clr-dropdown>
</div>
@ -192,7 +192,7 @@
>EDIT</a
>
<a
[routerLink]="['/submitted']"
[routerLink]="['/review/submitted']"
[class.active]="
router.url.includes('submitted') ||
router.url.includes('approve') ||
@ -224,7 +224,7 @@
<ul class="nav">
<li class="nav-item">
<a
[routerLink]="['/submitted']"
[routerLink]="['/review/submitted']"
class="nav-link nav-text"
routerLinkActive="active"
>SUBMIT</a
@ -232,15 +232,16 @@
</li>
<li class="nav-item">
<a
[routerLink]="['/approve']"
[routerLink]="['/review/approve']"
class="nav-link nav-text"
[class.active]="router.url.includes('approve')"
routerLinkActive="active"
>APPROVE</a
>
</li>
<li class="nav-item">
<a
[routerLink]="['/history']"
[routerLink]="['/review/history']"
class="nav-link nav-text"
routerLinkActive="active"
>HISTORY</a

View File

@ -57,24 +57,15 @@ export class AppComponent {
private elementRef: ElementRef
) {
this.parseDcAdapterSettings()
/**
* Prints app info in the console such as:
* - Adapter versions
* - App version
* - Build timestamp
*
*/
;(window as any).appinfo = () => {
const licenseKeyData = this.licenceService.getLicenseKeyData()
if (licenseKeyData) {
const expiry_date = moment(
licenseKeyData.valid_until,
'YYYY-MM-DD'
).startOf('day')
const current_date = moment().startOf('day')
const daysToExpiry = expiry_date.diff(current_date, 'days')
licenseKeyData.valid_until += ` (${daysToExpiry} ${
daysToExpiry === 1 ? 'day' : 'days'
} remaining)`
if (isNaN(daysToExpiry)) licenseKeyData.valid_until = 'Unlimited'
}
console.table({
'Adapter version': VERSION.adapterVersion || 'n/a',
'App version': (VERSION.tag || '').replace('v', ''),
@ -87,7 +78,12 @@ export class AppComponent {
this.subscribeToLicenseEvents()
/**
* Fetches git tag ang git hash from `version.ts` file
* It's placed in the user drop down.
*/
this.commitVer = (VERSION.tag || '').replace('v', '') + '.' + VERSION.hash
router.events.subscribe((val) => {
this.routeUrl = this.router.url
@ -127,8 +123,10 @@ export class AppComponent {
this.subscribeToAppActive()
this.subscribeToDemoLimitModal()
/* In Viya streaming apps, content is served within an iframe. This code
makes that iframe "full screen" so it looks like a regular window. */
/**
* In Viya streaming apps, content is served within an iframe. This code
* makes that iframe "full screen" so it looks like a regular window.
*/
if (window.frameElement) {
window.frameElement.setAttribute(
'style',
@ -143,6 +141,9 @@ export class AppComponent {
}
}
/**
* Parses adapter settings that are found in the <sasjs> tag inside index.html
*/
private parseDcAdapterSettings() {
const sasjsElement = document.querySelector('sasjs')
@ -180,9 +181,14 @@ export class AppComponent {
this.appService.sasServiceInit()
}
/**
* Opens licence page with the active licence problem
* Problem details are encoded in the url
*/
public licenceProblemDetails(url: string) {
this.router.navigateByUrl(url)
}
/**
* Based on string provided we return true, false or null
* True -> Compute API
@ -199,6 +205,12 @@ export class AppComponent {
return value === 'true' || false
}
/**
* Listens for an `demo limit` event that will show the `Feature locked modal`
* For exmaple when in editor upload feature is not enabled
* When user tries to upload the excel, editor component will trgger this event
* And stop the execution of file upload code.
*/
public subscribeToDemoLimitModal() {
this.eventService.onDemoLimitModalShow.subscribe((featureName: string) => {
this.demoLimitNotice = {
@ -208,6 +220,10 @@ export class AppComponent {
})
}
/**
* Listens for licence events so banner can be displayed.
* App is free tier, licence will expire, is expired or is invalid
*/
public subscribeToLicenseEvents() {
this.licenceService.isAppFreeTier.subscribe((isAppFreeTier: boolean) => {
this.freeTierBanner = isAppFreeTier
@ -227,6 +243,10 @@ export class AppComponent {
)
}
/**
* Listens for an event that will activate od deactivate full application.
* Based on licence key prcoessing result
*/
public subscribeToAppActive() {
this.licenceService.isAppActivated.subscribe((value: any) => {
this.appActive = value
@ -248,31 +268,51 @@ export class AppComponent {
})
}
/**
* When startupservice request is finished with valid response, this event will
* make sure loading screen is gone.
*/
public subscribeToStartupData() {
this.eventService.onStartupDataLoaded.subscribe(() => {
this.startupDataLoaded = true
})
}
/**
* Opens requests modal when requested from event service
*/
public subscribeToRequestsModal() {
this.eventService.onRequestsModalOpen.subscribe((value: boolean) => {
this.requestsModal = true
})
}
/**
* Closes abort modal with matching ID (there could be multiple abort modals open)
*/
public closeAbortModal(abortId: number) {
let abortIndex = this.sasjsAborts.findIndex((abort) => abort.id === abortId)
this.sasjsAborts.splice(abortIndex, 1)
}
/**
* Toggles sidebar when requested from event service
*/
public toggleSidebar() {
this.eventService.toggleSidebar()
}
/**
* Whether or not current route includes the route from param
* @param route route to check
*/
public isMainRoute(route: string): boolean {
return this.router.url.includes(route)
}
/**
* Opens a page for updating the licence.
*/
public openLicencingPage() {
this.router.navigateByUrl('/licensing/update')
}

View File

@ -11,33 +11,16 @@ import { NotFoundComponent } from './not-found/not-found.component'
import { SasStoreService } from './services/sas-store.service'
import { SharedModule } from './shared/shared.module'
// import { EditorComponent } from './editor/editor.component'
import { ActionsComponent } from './actions/actions.component'
import { AppSharedModule } from './app-shared.module'
import { ApproveDetailsComponent } from './approve-details/approve-details.component'
import { ApproveComponent } from './approve/approve.component'
import { DeployComponent } from './deploy/deploy.component'
import { AutomaticComponent } from './deploy/sections/automatic/automatic.component'
import { ManualComponent } from './deploy/sections/manual/manual.component'
import { SasjsConfiguratorComponent } from './deploy/sections/sasjs-configurator/sasjs-configurator.component'
import { GroupComponent } from './group/group.component'
import { HistoryComponent } from './history/history.component'
import { LicensingComponent } from './licensing/licensing.component'
import { LineageComponent } from './lineage/lineage.component'
import { MetadataComponent } from './metadata/metadata.component'
import { PipesModule } from './pipes/pipes.module'
import { RoleComponent } from './role/role.component'
import { ApproveRouteComponent } from './routes/approve-route/approve-route.component'
import { HistoryRouteComponent } from './routes/history-route/history-route.component'
import { ReviewRouteComponent } from './routes/review-route/review-route.component'
import { LicensingGuard } from './routes/licensing.guard'
import { UsernavRouteComponent } from './routes/usernav-route/usernav-route.component'
import { AppService } from './services/app.service'
import { InfoModalComponent } from './shared/abort-modal/info-modal.component'
import { RequestsModalComponent } from './shared/requests-modal/requests-modal.component'
import { SubmitterComponent } from './submitter/submitter.component'
import { UserComponent } from './user/user.component'
import { HomeModule } from './home/home.module'
import { SystemComponent } from './system/system.component'
import { DirectivesModule } from './directives/directives.module'
import { ViyaApiExplorerComponent } from './viya-api-explorer/viya-api-explorer.component'
import { NgxJsonViewerModule } from 'ngx-json-viewer'
@ -46,27 +29,11 @@ import { NgxJsonViewerModule } from 'ngx-json-viewer'
declarations: [
AppComponent,
NotFoundComponent,
ApproveComponent,
ApproveDetailsComponent,
ActionsComponent,
HistoryComponent,
LineageComponent,
SubmitterComponent,
ApproveRouteComponent,
HistoryRouteComponent,
MetadataComponent,
ReviewRouteComponent,
ReviewRouteComponent,
UsernavRouteComponent,
UserComponent,
GroupComponent,
RoleComponent,
RequestsModalComponent,
DeployComponent,
InfoModalComponent,
LicensingComponent,
ManualComponent,
AutomaticComponent,
SasjsConfiguratorComponent,
SystemComponent,
ViyaApiExplorerComponent
],
imports: [
@ -84,7 +51,7 @@ import { NgxJsonViewerModule } from 'ngx-json-viewer'
DirectivesModule,
NgxJsonViewerModule
],
providers: [AppService, SasStoreService, ApproveComponent, LicensingGuard],
providers: [AppService, SasStoreService, LicensingGuard],
bootstrap: [AppComponent]
})
export class AppModule {}

View File

@ -7,22 +7,20 @@ import { ModuleWithProviders } from '@angular/core'
import { Routes, RouterModule } from '@angular/router'
import { HomeComponent } from './home/home.component'
import { ApproveComponent } from './approve/approve.component'
import { ApproveDetailsComponent } from './approve-details/approve-details.component'
import { ActionsComponent } from './actions/actions.component'
import { HistoryComponent } from './history/history.component'
import { NotFoundComponent } from './not-found/not-found.component'
import { SubmitterComponent } from './submitter/submitter.component'
import { ApproveRouteComponent } from './routes/approve-route/approve-route.component'
import { DeployComponent } from './deploy/deploy.component'
import { LicensingComponent } from './licensing/licensing.component'
import { LicensingGuard } from './routes/licensing.guard'
import { ReviewRouteComponent } from './routes/review-route/review-route.component'
import { StageModule } from './stage/stage.module'
import { EditorModule } from './editor/editor.module'
import { ViewerModule } from './viewer/viewer.module'
import { SystemComponent } from './system/system.component'
import { ReviewModule } from './review/review.module'
import { DeployModule } from './deploy/deploy.module'
import { LicensingModule } from './licensing/licensing.module'
import { SystemModule } from './system/system.module'
/**
* Defining routes
*/
export const ROUTES: Routes = [
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{
@ -30,23 +28,28 @@ export const ROUTES: Routes = [
loadChildren: () => ViewerModule
},
{
path: 'approve',
component: ApproveRouteComponent,
/**
* Load review module (approve, history, submitted)
*/
path: 'review',
component: ReviewRouteComponent,
children: [
{ path: '', pathMatch: 'full', redirectTo: 'toapprove' },
{ path: 'toapprove', component: ApproveComponent },
{ path: 'approveDet/:tableId', component: ApproveDetailsComponent },
{ path: 'submitted', component: SubmitterComponent }
{
path: '',
loadChildren: () => ReviewModule
}
]
},
{
path: 'licensing/:action',
component: LicensingComponent,
canActivate: [LicensingGuard],
canDeactivate: [LicensingGuard]
path: 'licensing',
loadChildren: () => LicensingModule
},
{ path: 'home', component: HomeComponent },
{
/**
* Load editor module with subroutes
*/
path: 'editor',
loadChildren: () => EditorModule
},
@ -54,16 +57,20 @@ export const ROUTES: Routes = [
path: 'stage',
loadChildren: () => StageModule
},
{ path: 'system', component: SystemComponent },
{ path: 'actions/:libds/:dsid', component: ActionsComponent },
{ path: 'history', component: HistoryComponent },
{ path: 'submitted', component: SubmitterComponent },
{ path: 'submitted/:tableId', component: SubmitterComponent },
{ path: 'deploy', component: DeployComponent },
{ path: 'deploy/manualdeploy', component: DeployComponent },
{
path: 'system',
loadChildren: () => SystemModule
},
{
path: 'deploy',
loadChildren: () => DeployModule
},
{ path: '**', component: NotFoundComponent }
]
/**
* Exporting routes
*/
export const ROUTING: ModuleWithProviders<RouterModule> = RouterModule.forRoot(
ROUTES,
{ useHash: true }

View File

@ -0,0 +1,14 @@
import { NgModule } from '@angular/core'
import { RouterModule, Routes } from '@angular/router'
import { DeployComponent } from './deploy.component'
const routes: Routes = [
{ path: '', component: DeployComponent },
{ path: 'manualdeploy', component: DeployComponent }
]
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class DeployRoutingModule {}

View File

@ -78,6 +78,9 @@ export class DeployComponent implements OnInit {
this.setDeployDefaults()
}
/**
* Setting default values used for deploy request
*/
public setDeployDefaults() {
this.dcPath = this.dcAdapterSettings?.dcPath || ''
this.selectedAdminGroup = this.dcAdapterSettings?.adminGroup || ''
@ -86,6 +89,9 @@ export class DeployComponent implements OnInit {
}
}
/**
* Accepting terms of service shows next screen
*/
public termsAgreeChange() {
if (!this.autodeploy) {
this.getAdminGroups()
@ -94,6 +100,9 @@ export class DeployComponent implements OnInit {
this.step++
}
/**
* Fetches admin groups from VIYA to be selected for a backend deploy
*/
public getAdminGroups() {
fetch(
this.sasJsConfig.serverUrl + '/identities/groups?sortBy=name&limit=5000',

View File

@ -0,0 +1,20 @@
import { NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { DeployComponent } from './deploy.component'
import { AutomaticComponent } from './sections/automatic/automatic.component'
import { ManualComponent } from './sections/manual/manual.component'
import { SasjsConfiguratorComponent } from './sections/sasjs-configurator/sasjs-configurator.component'
import { ClarityModule } from '@clr/angular'
import { FormsModule } from '@angular/forms'
import { DeployRoutingModule } from './deploy-routing.module'
@NgModule({
declarations: [
DeployComponent,
AutomaticComponent,
ManualComponent,
SasjsConfiguratorComponent
],
imports: [CommonModule, FormsModule, ClarityModule, DeployRoutingModule]
})
export class DeployModule {}

View File

@ -55,6 +55,13 @@ export class AutomaticComponent implements OnInit {
ngOnInit(): void {}
/**
* Executes sas.json file to deploy the backend
* Method will first try to run the `auto deploy`
* If that fails the rest of the code is ignored.
* If request is successfull, method will continue to try
* to create database if checkbox is toggled on
*/
public async executeJson() {
this.autodeploying = true
this.isSubmittingJson = true
@ -99,6 +106,9 @@ export class AutomaticComponent implements OnInit {
}
}
/**
* Runs the `makedata` request sending the ADMIN and DCPATH values
*/
public createDatabase() {
let data = {
fromjs: [

View File

@ -52,6 +52,9 @@ export class ManualComponent implements OnInit {
ngOnInit(): void {}
/**
* FIXME: Remove
*/
public async executableContext() {
// getExecutableContexts now need AuthConfig parameter which we don't have on web
// this.contextsLoading = true
@ -65,10 +68,16 @@ export class ManualComponent implements OnInit {
// this.contextsLoading = false
}
/**
* Removes sas.json file attached to the input
*/
public clearUploadInput(event: Event) {
this.deployService.clearUploadInput(event)
}
/**
* Reads attached SAS file to be sent to sas for execution (backend deploy)
*/
public onSasFileChange(event: any) {
this.preloadedFile = false
@ -93,12 +102,18 @@ export class ManualComponent implements OnInit {
fileReader.readAsText(file)
}
/**
* Reads attached JSON file to be sent to sas for execution (backend deploy)
*/
public async onJsonFileChange(event: any) {
let file = event.target.files[0]
this.jsonFile = await this.deployService.readFile(file)
}
/**
* Appending precode lines to the attached sas or json file for backend deploy
*/
public addPrecodeLines() {
let headerLines = [
`%let context=${this.selectedContext};`,
@ -110,6 +125,9 @@ export class ManualComponent implements OnInit {
this.linesOfCode.unshift(...headerLines)
}
/**
* Downloadng file with precode included
*/
public downloadSasPrecodeFile() {
let linesAsText = this.linesOfCode.join('\n')
let filename = this.fileName.split('.')[0]
@ -117,6 +135,9 @@ export class ManualComponent implements OnInit {
this.downloadFile(linesAsText, filename, 'sas')
}
/**
* Used for downloading log and repsonse as a file
*/
public downloadFile(
content: any,
filename: string,
@ -125,10 +146,17 @@ export class ManualComponent implements OnInit {
this.deployService.downloadFile(content, filename, extension)
}
/**
* Saving dcpath to localstorage
* FIXME: maybe it'snot necessary
*/
public saveDcPath() {
localStorage.setItem('deploy_dc_loc', this.dcPath)
}
/**
* Send sas.json to be executed (deploying backend)
*/
public async executeJson() {
this.isSubmittingJson = true
@ -162,6 +190,9 @@ export class ManualComponent implements OnInit {
this.isSubmittingJson = false
}
/**
* Send sas file to be executed (deploying backend)
*/
public async executeSAS() {
this.executingScript = true
this.jobLog = ''
@ -194,6 +225,10 @@ export class ManualComponent implements OnInit {
}
}
/**
* Running makedata service
* @param newTab open and run in new tab
*/
public createDatabase(newTab: boolean = true) {
if (newTab) {
let url =

View File

@ -5,7 +5,6 @@ import { ServerType } from '@sasjs/utils/types/serverType'
import { DcAdapterSettings } from 'src/app/models/DcAdapterSettings'
import { SASGroup } from 'src/app/models/sas/public-getgroups.model'
import { SASjsApiServerInfo } from 'src/app/models/sasjs-api/SASjsApiServerInfo.model'
import { HelperService } from 'src/app/services/helper.service'
import { SasService } from 'src/app/services/sas.service'
import { SasjsService } from 'src/app/services/sasjs.service'
@ -51,6 +50,9 @@ export class SasjsConfiguratorComponent implements OnInit {
this.getServerInfo()
}
/**
* Fethes the sasjs server instance info
*/
getServerInfo() {
this.sasjsService
.getServerInfo()
@ -59,6 +61,9 @@ export class SasjsConfiguratorComponent implements OnInit {
})
}
/**
* Fetches user groups from the `usernav/usergroupsbymember` service
*/
getUserGroups() {
this.loading = true
@ -99,6 +104,9 @@ export class SasjsConfiguratorComponent implements OnInit {
)
}
/**
* Creating database
*/
makeData() {
// const _debug = "&_debug=131"; //debug on
const _debug = ' ' //debug off

View File

@ -14,7 +14,9 @@ export class DragNdropDirective {
@Output() fileDropped = new EventEmitter<any>()
@Output() fileDraggedOver = new EventEmitter<any>()
// Dragover listener
/**
* Dragover listener
*/
@HostListener('dragover', ['$event'])
onDragOver(event: any) {
event.preventDefault()
@ -26,7 +28,9 @@ export class DragNdropDirective {
}
}
// Dragleave listener
/**
* Dragleave listener
*/
@HostListener('dragleave', ['$event'])
public onDragLeave(event: any) {
event.preventDefault()
@ -34,7 +38,9 @@ export class DragNdropDirective {
this.fileOver = false
}
// Drop listener
/**
* Drop listener
*/
@HostListener('drop', ['$event'])
public ondrop(event: any) {
event.preventDefault()
@ -48,6 +54,9 @@ export class DragNdropDirective {
}
}
/**
* Checks wether dragging element contain files
*/
private containsFiles(event: any) {
if (event && event.dataTransfer && event.dataTransfer.types) {
for (let i = 0; i < event.dataTransfer.types.length; i++) {

View File

@ -22,6 +22,9 @@ export class FileDropDirective {
this.element = element
}
/**
* Dragging element drop event
*/
@HostListener('drop', ['$event'])
onDrop(event: DragEvent): void {
this._preventAndStop(event)
@ -39,6 +42,9 @@ export class FileDropDirective {
this.fileDrop.emit(fileList)
}
/**
* Dragging element drag over event
*/
@HostListener('dragover', ['$event'])
onDragOver(event: DragEvent): void {
this._preventAndStop(event)
@ -59,6 +65,10 @@ export class FileDropDirective {
this.fileOver.emit(false)
}
/**
* Prevent propagation trough elements and stop default behavior
* For particular event
*/
protected _preventAndStop(event: MouseEvent): void {
event.preventDefault()
event.stopPropagation()

View File

@ -21,6 +21,9 @@ export class FileSelectDirective {
this.element = element
}
/**
* Checks if files exist in the input after input change
*/
isEmptyAfterSelection(): boolean {
return !!this.element.nativeElement.attributes.multiple
}

View File

@ -1,7 +0,0 @@
export interface RowValidation {
valid: boolean
invalidError: string
rowNumber?: number
colName?: string
value?: string
}

View File

@ -59,6 +59,12 @@ export class EditRecordComponent implements OnInit {
ngOnInit(): void {}
/**
* Runs native HOT validator against cell value
* @param cellValidation column rules
* @param cellValue value in the cell that is beign validated
* @returns Promise boolean - wether valid or invalid
*/
async validateRecordCol(
cellValidation: any,
cellValue: any
@ -74,6 +80,12 @@ export class EditRecordComponent implements OnInit {
})
}
/**
* Fired when date field in the record change
* Function will parse date and format to string
* @param date picker value
* @param colKey column name (key)
*/
recordDateChange(date: Date, colKey: string) {
let cellValidation = this.currentRecordValidator?.getRule(colKey)
let format = cellValidation ? cellValidation.dateFormat : ''
@ -82,24 +94,38 @@ export class EditRecordComponent implements OnInit {
this.currentRecord[colKey] = moment(date).format(format)
}
isRecordModalInvalid(): boolean {
return this.currentRecordInvalidCols.length > 0
}
/**
* Close edit record modal and apply changes by emitting output event
*/
confirmRecordEdit() {
if (this.currentRecordInvalidCols.length < 1) {
this.onRecordChange.emit(this.currentRecord)
}
}
/**
* Close edit record modal without applying the changes
*/
closeRecordEdit() {
this.onRecordEditClose.emit()
}
/**
* Emitting output event when dropdown (autocomplete) input in any col change
* @param colName column name (key)
* @param col column index
*/
onRecordDropdownChange(colName: string, col: number) {
this.onRecordDropdownChanged.emit({ colName, col })
}
/**
* Emitting output event when input is focused (clicked on) so we can run a `dynamic cell validation`
* Since that bit must be run from the parent component (editor.component)
* Result is then applied in the `cellValidation` variable and automatically updated in this component.
* @param event input event
* @param colName column name (key)
*/
onRecordInputFocus(event: any, colName: number) {
this.onRecordInputFocused.emit({ event, colName })
}

View File

@ -15,7 +15,15 @@ import { Subject, Subscription } from 'rxjs'
import { SasStoreService } from '../services/sas-store.service'
import * as XLSX from '@sheet/crypto'
/**
* Used in combination with buffer
*/
const iconv = require('iconv-lite')
/**
* In combination with `iconv` is used for encoding json data captured with sheet js from excel file into a file again
* Which will be send to backend
*/
const Buffer = require('buffer/').Buffer
type AOA = any[][]
@ -374,6 +382,9 @@ export class EditorComponent implements OnInit, AfterViewInit {
this.setRestrictions()
}
/**
* Prepare feature restrictions based on licence key
*/
private parseRestrictions() {
this.restrictions.restrictAddRecord =
this.licenceState.value.addRecord === false
@ -383,6 +394,10 @@ export class EditorComponent implements OnInit, AfterViewInit {
this.licenceState.value.fileUpload === false
}
/**
* Applying prepared restrictions
* @param overrideRestrictions can be used to apply and override specific restrictions
*/
private setRestrictions(overrideRestrictions?: EditorRestrictions) {
if (overrideRestrictions) {
this.restrictions = {
@ -402,6 +417,9 @@ export class EditorComponent implements OnInit, AfterViewInit {
}
}
/**
* Disabling add row button based on wether rows limit is present
*/
private checkRowLimit() {
if (this.columnLevelSecurityFlag) return
@ -416,12 +434,19 @@ export class EditorComponent implements OnInit, AfterViewInit {
}
}
/**
* Resetting filter variables
*/
public resetFilter() {
if (this.queryFilterCompList.first) {
this.queryFilterCompList.first.resetFilter()
}
}
/**
* Openning file upload modal
* If feature is locked, `feature locked` modal will be shown
*/
public onShowUploadModal() {
if (this.restrictions.restrictFileUpload) {
this.eventService.showDemoLimitModal('File Upload')
@ -439,6 +464,10 @@ export class EditorComponent implements OnInit, AfterViewInit {
if (!this.uploadPreview) this.showUploadModal = true
}
/**
* Called by FileDropDirective
* @param e true if file is dragged over the drop zone
*/
public fileOverBase(e: boolean): void {
this.hasBaseDropZoneOver = e
}
@ -620,6 +649,10 @@ export class EditorComponent implements OnInit, AfterViewInit {
return returnObj
}
/**
* When excel is password protected we will display the password promppt for user to type password in.
* @returns Password user input or undefined if discarded by user
*/
public promptExcelPassword(): Promise<string | undefined> {
return new Promise((resolve, reject) => {
this.filePasswordModal = true
@ -645,6 +678,13 @@ export class EditorComponent implements OnInit, AfterViewInit {
})
}
/**
* Parses attached file, to be uploaded
* If attached file is CSV it will be send to backend straight away
* If attached file is EXCEL it will be displayed in the table, in preview mode
* @param event file drop event
* @param dropped whether it's dropped or added by browse button
*/
public getFileDesc(event: any, dropped: boolean = false) {
this.excelUploadState = 'Loading'
this.excelFileParsing = true
@ -1010,6 +1050,9 @@ export class EditorComponent implements OnInit, AfterViewInit {
}
}
/**
* Submits attached excel file that is in preview mode
*/
public submitExcel() {
if (this.licenceState.value.submit_rows_limit !== Infinity) {
this.submitLimitNotice = true
@ -1019,6 +1062,9 @@ export class EditorComponent implements OnInit, AfterViewInit {
this.getFile()
}
/**
* This method will run validations and upload all of the pending files that are in the uploader queue
*/
public getFile() {
if (this.checkInvalid()) {
this.eventService.showAbortModal(null, 'Invalid values are present.')
@ -1091,6 +1137,9 @@ export class EditorComponent implements OnInit, AfterViewInit {
)
}
/**
* After excel file is attached and parsed, this function will display it's content in the HOT table in read only mode
*/
public getPendingExcelPreview() {
this.queryTextSaved = this.queryText
this.queryText = ''
@ -1142,46 +1191,12 @@ export class EditorComponent implements OnInit, AfterViewInit {
this.excelFileParsing = false
this.excelUploadState = null
})
/**
* This is half validation feature to speed up file upload
* Currently disabled but will leave it here in case it needs to be re-enabled
*/
// this.excelUploadState = 'Validating-DQ'
// this.validateRowsOnPendingExcel(
// async (rowValidation: RowValidation | undefined) => {
// if (rowValidation) {
// this.eventService.showAbortModal(
// 'Excel validation',
// `Please fix the data and re-submit the file. Invalid data details: <br><br> Row: ${rowValidation.rowNumber} <br> Column: ${rowValidation.colName} <br> Reason: <strong>${rowValidation.invalidError}</strong> <br> Invalid value: ${rowValidation.value}`
// )
// this.excelFileParsing = false
// this.excelUploadState = null
// } else {
// this.excelUploadState = 'Validating-HOT'
// hot.updateSettings(
// {
// data: this.dataSource
// },
// false
// )
// hot.render()
// hot.validateCells(() => {
// this.showUploadModal = false
// this.uploadPreview = true
// this.excelFileParsing = false
// this.excelUploadState = null
// })
// }
// }
// )
}
/**
* Drops the attached excel file
* @param discardData wheter to discard data parsed from the file or to keep it in the table after dropping a attached excel file
*/
public discardPendingExcel(discardData?: boolean) {
this.hotInstance.updateSettings({
maxRows: this.licenceState.value.editor_rows_allowed
@ -1205,6 +1220,10 @@ export class EditorComponent implements OnInit, AfterViewInit {
}
}
/**
* Drops attached excel file, keeps it's data in the DC table
* User can now edit the table and submit. Witout the file present.
*/
public previewTableEditConfirm() {
this.discardPendingExcel()
this.convertToCorrectTypes(this.dataSource)

View File

@ -1,5 +1,10 @@
import { DcValidation } from 'src/app/shared/dc-validator/models/dc-validation.model'
/**
* Wrapper for DC Validation because we need `noLinkOption` property
* to be used as a flag to show/hide button that generates link for the
* edit record modal
*/
export interface EditRecordModal extends DcValidation {
noLinkOption: boolean
[key: string]: any

View File

@ -1,19 +0,0 @@
export interface CellValidation {
data: string
length: number
type?: string
source: string[]
format?: number
validator?: any
valid?: boolean
renderer?: any
dateFormat?: string
readOnly?: boolean
desc?: string
correctFormat?: boolean
/**
* Key for accessing object fields, any type because it can be
* any of the types interface have
*/
[key: string]: any
}

View File

@ -1,36 +0,0 @@
export enum ColumnType {
string = 'string',
number = 'number'
}
export interface ColumnInterface {
id: number | undefined
name: string | undefined
type: ColumnType | undefined
length: number | undefined
}
export class Column implements ColumnInterface {
public id: number | undefined
public name: string | undefined
public type: ColumnType | undefined
public length: number | undefined
public static fromPlainObject(obj: object) {
return Object.assign(new Column(), obj)
}
constructor(id?: number, name?: string, type?: ColumnType, length?: number) {
this.id = id
this.name = name
this.type = type
this.length = length
}
get hsType() {
return (
(this.type === ColumnType.string && 'text') ||
(this.type === ColumnType.number && 'numeric') ||
null
)
}
}

View File

@ -1,3 +1,7 @@
/**
* Model for the dynamic cell validation in the editor
* (sending whole row to the backend service and recieving data for the cell dropdown)
*/
export interface DynamicExtendedCellValidation {