diff --git a/apps/picsa-apps/farmer-app-e2e/tsconfig.json b/apps/picsa-apps/farmer-app-e2e/tsconfig.json index ab8db0c13..2a431ff19 100644 --- a/apps/picsa-apps/farmer-app-e2e/tsconfig.json +++ b/apps/picsa-apps/farmer-app-e2e/tsconfig.json @@ -8,7 +8,7 @@ "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, + "noPropertyAccessFromIndexSignature": false, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true }, diff --git a/apps/picsa-apps/farmer-app/tsconfig.json b/apps/picsa-apps/farmer-app/tsconfig.json index 52eb4f718..316c8f8ba 100644 --- a/apps/picsa-apps/farmer-app/tsconfig.json +++ b/apps/picsa-apps/farmer-app/tsconfig.json @@ -18,7 +18,7 @@ "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, + "noPropertyAccessFromIndexSignature": false, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true }, diff --git a/apps/picsa-tools/crop-probability-tool-e2e/tsconfig.json b/apps/picsa-tools/crop-probability-tool-e2e/tsconfig.json index 0f3eb22c9..2b6ac459e 100644 --- a/apps/picsa-tools/crop-probability-tool-e2e/tsconfig.json +++ b/apps/picsa-tools/crop-probability-tool-e2e/tsconfig.json @@ -8,7 +8,7 @@ "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, + "noPropertyAccessFromIndexSignature": false, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true }, diff --git a/apps/picsa-tools/crop-probability-tool/tsconfig.json b/apps/picsa-tools/crop-probability-tool/tsconfig.json index e85865cf5..fbdce5d97 100644 --- a/apps/picsa-tools/crop-probability-tool/tsconfig.json +++ b/apps/picsa-tools/crop-probability-tool/tsconfig.json @@ -5,7 +5,7 @@ "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, + "noPropertyAccessFromIndexSignature": false, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true }, diff --git a/apps/picsa-tools/monitoring-tool-e2e/tsconfig.json b/apps/picsa-tools/monitoring-tool-e2e/tsconfig.json index ab8db0c13..2a431ff19 100644 --- a/apps/picsa-tools/monitoring-tool-e2e/tsconfig.json +++ b/apps/picsa-tools/monitoring-tool-e2e/tsconfig.json @@ -8,7 +8,7 @@ "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, + "noPropertyAccessFromIndexSignature": false, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true }, diff --git a/apps/picsa-tools/option-tool-e2e/tsconfig.json b/apps/picsa-tools/option-tool-e2e/tsconfig.json index 0f3eb22c9..2b6ac459e 100644 --- a/apps/picsa-tools/option-tool-e2e/tsconfig.json +++ b/apps/picsa-tools/option-tool-e2e/tsconfig.json @@ -8,7 +8,7 @@ "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, + "noPropertyAccessFromIndexSignature": false, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true }, diff --git a/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.html b/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.html index c78426605..4ea5e609f 100644 --- a/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.html +++ b/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.html @@ -1,8 +1,7 @@
-
{{warningText}}
- + + Practice
@@ -10,108 +9,156 @@
- +
- +
+
+
Who does the practice?
-
Female - - -
-
Male - +
+ Female + +
+
+ Male
-
{{gender.length>1 ? gender.join(" and "): gender[0]}}
+
+ {{ gender.length > 1 ? gender.join(' and ') : gender[0] }} +
- - + +
+
Benefits and who?
-
-
-
- -
Female - +
+
+
+ +
+ Female
-
Male - - -
-
Delete delete
+
+ Male + +
+
- +
- - + +
+
Performence in high, mid and low RF (rainfall)?
- water_drop + water_drop
+ style=" + display: flex; + gap: 1rem; + justify-content: space-evenly; + width: 100%; + flex-direction: row; + margin-bottom: 1.5rem; + margin-top: 2rem; + " + >
-
High RF
-
-
Mid RF
-
-
Low RF
- @@ -120,34 +167,58 @@
- + + matStepperNext + > + Next +
+
Investment in terms of money and time?
+ style=" + display: flex; + justify-content: space-evenly; + gap: 1rem; + width: 100%; + flex-direction: row; + margin-bottom: 1.5rem; + margin-top: 2rem; + " + >
-
Money attach_money
-
-
Time access_time
- @@ -156,53 +227,55 @@
- - + + matStepperNext + > + Next +
+
Time to start benefiting
-
- - + +
-
- - + +
+ -
Risk of practice (disadvantage)
- - + +
-
- - - - + +
- -
\ No newline at end of file +
diff --git a/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.scss b/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.scss index 5f4fd5a75..b2a50d2ea 100644 --- a/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.scss +++ b/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.scss @@ -1,5 +1,5 @@ .mat-stepper-horizontal { - margin-top: 8px; + margin-top: 27px; } .mat-mdc-form-field { @@ -12,13 +12,12 @@ font-size: 12px; } - .dialog-content { padding-bottom: 2rem; .saveButtonPosition { position: absolute; - left: 20px; - top: 20px + right: 20px; + top: 20px; } .StepTitle { @@ -33,7 +32,7 @@ flex-direction: column; align-items: flex-start; width: 50%; - gap: .4rem; + gap: 0.4rem; .StepContent { display: flex; @@ -67,30 +66,13 @@ font-size: 16px; outline-color: #8a2644; padding: 5px; - white-space: pre-wrap; - word-wrap: break-word; - vertical-align: top; - } - .delete-button{ - color: red; - background-color: white; - padding: 3px; - height: 6rem; - width: 4rem; - font-weight: 700; - display: flex; - border-radius: 5px; - gap: 5px; - flex-direction: column; - align-items: center; - justify-content: center; - border: 1px solid red; + white-space: pre-wrap; + word-wrap: break-word; + vertical-align: top; } - .ButtonSection { width: 15rem; - } } } @@ -116,5 +98,4 @@ justify-content: center; text-align: center; } - -} \ No newline at end of file +} diff --git a/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.ts b/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.ts index 271b740a6..ac6bcf452 100644 --- a/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.ts +++ b/apps/picsa-tools/option-tool/src/app/components/editor/editor.component.ts @@ -1,12 +1,13 @@ -import {Component,EventEmitter, OnInit, Output ,ViewChild} from '@angular/core'; -import { MatStepper } from '@angular/material/stepper' +import { Component, EventEmitter, OnInit, Output, ViewChild } from '@angular/core'; +import { MatStepper } from '@angular/material/stepper'; +import { PicsaDialogService } from '@picsa/shared/features'; export interface IOptionData { practice: string; - gender: string []; - benefits: {benefit:string, beneficiary:string[]} []; - performance:{lowRf:string, midRf:string, highRf:string}; - investment: {money:string, time:string}; + gender: string[]; + benefits: { benefit: string; beneficiary: string[] }[]; + performance: { lowRf: string; midRf: string; highRf: string }; + investment: { money: string; time: string }; time: string; risk: string; } @@ -16,142 +17,131 @@ export interface IOptionData { styleUrls: ['./editor.component.scss'], }) export class EditorComponent implements OnInit { - // stepCounter: number; - warningText: string; practiceEntry: string; - gender: string []; - benefits: {benefit:string, beneficiary:string[]} []; - perfomanceValues: {lowRf:string, midRf:string, highRf:string}; - performanceOptions: string[]=['good','ok','bad'] - investmentValues: {money:string, time:string}; - investmentOptions: string[]=['high','mid','low'] + gender: string[]; + benefits: { benefit: string; beneficiary: string[] }[]; + perfomanceValues: { lowRf: string; midRf: string; highRf: string }; + performanceOptions: string[] = ['good', 'ok', 'bad']; + investmentValues: { money: string; time: string }; + investmentOptions: string[] = ['high', 'mid', 'low']; benefitsStartTime: string; - risk:string; + risk: string; isLinear = false; - editMode= false - editIndex:number; @ViewChild(MatStepper) stepper: MatStepper; + @Output() dataTransfer = new EventEmitter(); - @Output() dataTransfer = new EventEmitter(); + constructor(private dialog: PicsaDialogService) {} ngOnInit(): void { - // this.stepCounter = 1; - this.gender=[], - this.benefits=[{ - benefit:'', - beneficiary:[] - }, - ] - this.perfomanceValues = { lowRf:"ok",midRf:"ok",highRf:"ok"} - this.investmentValues = {money:'high', time:'high'} - this.warningText=''; - this.practiceEntry=''; - this.gender= []; - this.perfomanceValues= {lowRf:"", midRf:"", highRf:""}; - this.investmentValues={money:"", time:""}; - this.benefitsStartTime =""; - this.risk=""; - this.editIndex = -1; - + this.gender = []; + this.benefits = [ + { + benefit: '', + beneficiary: [], + }, + ]; + this.perfomanceValues = { lowRf: 'ok', midRf: 'ok', highRf: 'ok' }; + this.investmentValues = { money: 'high', time: 'high' }; + this.practiceEntry = ''; + this.gender = []; + this.perfomanceValues = { lowRf: '', midRf: '', highRf: '' }; + this.investmentValues = { money: '', time: '' }; + this.benefitsStartTime = ''; + this.risk = ''; } - - handleGender(gender:string){ - if(!this.gender.includes(gender)){ - this.gender.push(gender) - }else{ - const index = this.gender.indexOf(gender) - this.gender.splice(index, 1); + + handleGender(gender: string) { + if (!this.gender.includes(gender)) { + this.gender.push(gender); + } else { + const index = this.gender.indexOf(gender); + this.gender.splice(index, 1); } } - handleBenficiaryGender(index:number, gender:string){ - if(!this.benefits[index].beneficiary.includes(gender)){ - this.benefits[index].beneficiary.push(gender) - }else{ - const itemIndex = this.benefits[index].beneficiary.indexOf(gender) + handleBenficiaryGender(index: number, gender: string) { + if (!this.benefits[index].beneficiary.includes(gender)) { + this.benefits[index].beneficiary.push(gender); + } else { + const itemIndex = this.benefits[index].beneficiary.indexOf(gender); this.benefits[index].beneficiary.splice(itemIndex, 1); } } - handleRemovingBenefits(index:number){ + handleRemovingBenefits(index: number) { this.benefits.splice(index, 1); } - handleMoreBenefits(){ + handleMoreBenefits() { this.benefits.push({ - benefit:'', - beneficiary:[] - }) + benefit: '', + beneficiary: [], + }); } onlyNumbers(event): boolean { - const charCode = (event.which) ? event.which : event.keyCode; + const charCode = event.which ? event.which : event.keyCode; if (charCode > 31 && (charCode < 48 || charCode > 57)) { return false; } return true; } - async submitForm (){ - //compile collected data - if(this.practiceEntry && - this.gender.length > 0 && - this.benefitsStartTime && - this.risk){ - const finalObject = { - data:{ - practice:this.practiceEntry, - gender: this.gender, - benefits:this.benefits, - performance:this.perfomanceValues, - investment:this.investmentValues, - time:this.benefitsStartTime, - risk:this.risk - }, - index:this.editIndex - } - this.dataTransfer.emit(finalObject); - this.resetVariables() - this.resetStepper() - }else{ - this.warningText = "Please fill all the fields" + async submitForm() { + // minimum for auto save should be at least a name + if (!this.practiceEntry) { + this.dataTransfer.emit(null); + return; } + const data: IOptionData = { + practice: this.practiceEntry, + gender: this.gender, + benefits: this.benefits, + performance: this.perfomanceValues, + investment: this.investmentValues, + time: this.benefitsStartTime, + risk: this.risk, + }; + this.dataTransfer.emit(data); + this.resetVariables(); + this.resetStepper(); } - resetVariables(){ + resetVariables() { // Reset variables when the component is destroyed. - this.gender=[], - this.benefits=[{ - benefit:'', - beneficiary:[] - }, - ] - this.perfomanceValues = { lowRf:"ok",midRf:"ok",highRf:"ok"} - this.investmentValues = {money:'high', time:'high'} - this.warningText=''; - this.practiceEntry=''; - this.gender= []; - this.perfomanceValues= {lowRf:"", midRf:"", highRf:""}; - this.investmentValues={money:"", time:""}; - this.benefitsStartTime =""; - this.risk="" - this.editIndex=-1 - this.editMode=false + this.gender = []; + this.benefits = [ + { + benefit: '', + beneficiary: [], + }, + ]; + this.perfomanceValues = { lowRf: 'ok', midRf: 'ok', highRf: 'ok' }; + this.investmentValues = { money: 'high', time: 'high' }; + this.practiceEntry = ''; + this.gender = []; + this.perfomanceValues = { lowRf: '', midRf: '', highRf: '' }; + this.investmentValues = { money: '', time: '' }; + this.benefitsStartTime = ''; + this.risk = ''; } //incase of edits - presetVariables(rowData:IOptionData,index:number){ - //remove all warinings - this.warningText=''; - //editor - this.editMode =true; - this.editIndex =index; - - this.benefits= rowData.benefits - this.perfomanceValues = rowData.performance - this.investmentValues = rowData.investment - this.practiceEntry=rowData.practice - this.gender= rowData.gender; - this.benefitsStartTime =rowData.time - this.risk=rowData.risk + presetVariables(rowData: IOptionData) { + this.benefits = rowData.benefits; + this.perfomanceValues = rowData.performance; + this.investmentValues = rowData.investment; + this.practiceEntry = rowData.practice; + this.gender = rowData.gender; + this.benefitsStartTime = rowData.time; + this.risk = rowData.risk; } resetStepper(): void { this.stepper.reset(); } + + async promptDelete() { + const dialogRef = await this.dialog.open('delete'); + dialogRef.afterClosed().subscribe((shouldDelete) => { + if (shouldDelete) { + this.dataTransfer.emit(null); + } + }); + } } diff --git a/apps/picsa-tools/option-tool/src/app/pages/home/home.component.html b/apps/picsa-tools/option-tool/src/app/pages/home/home.component.html index 3ef3416f0..c65f00e8a 100644 --- a/apps/picsa-tools/option-tool/src/app/pages/home/home.component.html +++ b/apps/picsa-tools/option-tool/src/app/pages/home/home.component.html @@ -1,91 +1,77 @@
-
- - - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - -
Practice{{ element.practice }}Practice{{ element.practice }}Who does it{{ element.gender.join(',') }}Who does it{{ element.gender.join(',') }}Benefits and who -
    -
  1. - {{benefit.benefit}} -
    {{benefit.beneficiary.join(',')}}
    -
    2. -
- 		Benefits and who +
    +
  1. + {{ benefit.benefit }} +
    {{ benefit.beneficiary.join(',') }}
    +
    2. +
+ 		Perfomence -
    -
  1. - High(Rf): {{ element.performance.highRf }} -
    2. -
  2. - Mid(Rf): {{ element.performance.midRf }} -
    3. -
  3. - low(Rf): {{ element.performance.lowRf }} -
    4. -
- 		Perfomence +
    +
  1. High(Rf): {{ element.performance.highRf }}
    2. +
  2. Mid(Rf): {{ element.performance.midRf }}
    3. +
  3. low(Rf): {{ element.performance.lowRf }}
    4. +
+ 		Investment -
    -
  1. - Money: {{ element.investment.money }} -
    2. -
  2. - Time: {{ element.investment.time }} -
    3. -
- - 		Investment +
    +
  1. Money: {{ element.investment.money }}
    2. +
  2. Time: {{ element.investment.time }}
    3. +
+ 		Time{{ element.time }}Time{{ element.time }}Risks{{ element.risk }}Risks{{ element.risk }}
- -
-
-
- -
- + + + + +
+
+
+ +
+
-
\ No newline at end of file diff --git a/apps/picsa-tools/option-tool/src/app/pages/home/home.component.scss b/apps/picsa-tools/option-tool/src/app/pages/home/home.component.scss index ec7260397..26f982b83 100644 --- a/apps/picsa-tools/option-tool/src/app/pages/home/home.component.scss +++ b/apps/picsa-tools/option-tool/src/app/pages/home/home.component.scss @@ -31,9 +31,11 @@ th { .slide-in { position: absolute; bottom: 0; + display: none; transition: transform 0.3s ease-in-out; transform: translateY(100%); } .slide-in.active { transform: translateY(0); + display: block; } \ No newline at end of file diff --git a/apps/picsa-tools/option-tool/src/app/pages/home/home.component.ts b/apps/picsa-tools/option-tool/src/app/pages/home/home.component.ts index 5b167e4e7..2cbd38c8b 100644 --- a/apps/picsa-tools/option-tool/src/app/pages/home/home.component.ts +++ b/apps/picsa-tools/option-tool/src/app/pages/home/home.component.ts @@ -1,12 +1,12 @@ -import { Component,ViewChild } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { EditorComponent } from '../../components/editor/editor.component'; export interface IOptionData { practice: string; - gender: string []; - benefits: {benefit:string, beneficiary:string[]} []; - performance:{lowRf:string, midRf:string, highRf:string}; - investment: {money:string, time:string}; + gender: string[]; + benefits: { benefit: string; beneficiary: string[] }[]; + performance: { lowRf: string; midRf: string; highRf: string }; + investment: { money: string; time: string }; time: string; risk: string; } @@ -15,48 +15,45 @@ export interface IOptionData { selector: 'option-home', templateUrl: './home.component.html', styleUrls: ['./home.component.scss'], - }) export class HomeComponent { - public dataSource: IOptionData[] = []; - public displayedColumns: string[] = ['practice', 'gender', 'benefits', - 'performance','investment','time','risk' ]; + public dataSource: IOptionData[] = []; + public displayedColumns: string[] = ['practice', 'gender', 'benefits', 'performance', 'investment', 'time', 'risk']; + + private editorIndex = 0; @ViewChild(EditorComponent) editorComponent: EditorComponent; - matStepperOpen = false; public openDialog() { - this.matStepperOpen = true + this.matStepperOpen = true; } - public closeDialog(){ - this.matStepperOpen = false + public closeDialog() { + this.matStepperOpen = false; } - onDataTransfer(data:{data:IOptionData,index:number}) { - console.log('Received data from editor:', data); - // close the child component - if(data.index > -1){ - this.dataSource[data.index]=data.data - //invoke change detaction - this.dataSource=[...this.dataSource] - }else{ - this.dataSource = [...this.dataSource, data.data]; + onDataTransfer(data: IOptionData | null) { + // create a deep clone of data source to allow change detection for nested array objects + const allData = JSON.parse(JSON.stringify(this.dataSource)); + if (data) { + allData[this.editorIndex] = data; + } else { + // remove any existing entry entry if no data passed back + if (allData[this.editorIndex]) { + allData.splice(this.editorIndex, 1); + } } - //detect change for the case of editing a raw - this.matStepperOpen = false; + this.dataSource = allData; + this.closeDialog(); } - openNewDialog(){ + openNewDialog() { + this.editorIndex = this.dataSource.length; this.editorComponent.resetVariables(); - this.openDialog() + this.openDialog(); } onRowClicked(row: IOptionData, index: number) { - // console.log('Row clicked', row); - // console.log('Index of the Row', index) - // open stepper with this data - // since it is already running with the current home page - this.editorComponent.presetVariables(row,index); - this.openDialog() + this.editorIndex = index; + this.editorComponent.presetVariables(row); + this.openDialog(); } - } diff --git a/apps/picsa-tools/option-tool/tsconfig.json b/apps/picsa-tools/option-tool/tsconfig.json index e85865cf5..fbdce5d97 100644 --- a/apps/picsa-tools/option-tool/tsconfig.json +++ b/apps/picsa-tools/option-tool/tsconfig.json @@ -5,7 +5,7 @@ "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, + "noPropertyAccessFromIndexSignature": false, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true }, diff --git a/libs/webcomponents-ngx/tsconfig.json b/libs/webcomponents-ngx/tsconfig.json index 1c995b83b..c5e4eb765 100644 --- a/libs/webcomponents-ngx/tsconfig.json +++ b/libs/webcomponents-ngx/tsconfig.json @@ -15,7 +15,7 @@ "forceConsistentCasingInFileNames": true, "strict": true, "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, + "noPropertyAccessFromIndexSignature": false, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true },