Skip to content

Commit

Permalink
qbd direct integration advanced settings html changes (#950)
Browse files Browse the repository at this point in the history 
qbd direct integration advanced settings html changes
  • Loading branch information
@DhaaraniCIT
DhaaraniCIT authored Sep 24, 2024
1 parent 2ff13ba commit 7fd2f67
Show file tree
Hide file tree
Showing 9 changed files with 193 additions and 88 deletions.
35 changes: 13 additions & 22 deletions src/app/branding/c1-contents-config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,28 +64,19 @@ export const c1Contents = {
advancedSettings: {
stepName: 'Advanced settings',
contentText: 'Customize the integration based on your accounting requirements.',
scheduleAutoExport: 'Schedule automatic export',
email: 'Send error notification to',
paymentSyncLabel: 'Auto-sync payment status for reimbursable expenses',
autoCreateVendorsLabel: 'Auto create ',
autoCreateMerchantsAsVendorsLabel: 'Auto create ' + brandingConfig.brandName + ' merchants as vendors on QuickBooks Desktop',
billPaymentAccountLabel: 'To which payment account should the payment entries be posted?',
billPaymentAccountSubLabel: ', the payment entries will be posted to the selected payment account in ',
postEntriesCurrentPeriod: 'Post entries in the current accounting period',
dfvSubLabel: 'If you\'ve made a field mandatory in QuickBooks Desktop but don\'t collect a value from your employees in the expense form, you can set a default value here to be added to all the expenses.',
dfvLabel: 'Default field values',
changeAccountingPeriodSubLabel: 'If the accounting period is closed, the expenses will be exported with a date stamp for the first day of the current open accounting period.',
defaultPaymentAccount: 'Select payment bank account',
memoStructureLabel: 'Set the line-item description field in QuickBooks Desktop',
memoStructureSubLabel: 'Choose from a list of available data points that you\'d like to export to the description field in QuickBooks Desktop. ',
customizationSubLabel: 'Customize the data that you\'d like to export from Expense Management to QuickBooks Desktop by choosing which data points need to be exported.',
automationSubLabel: 'Automate exports and data syncs.',
scheduleSubLabel: 'Set up a schedule to automate the export of expenses from Expense Management to QuickBooks Desktop.',
frequencySubLabel: 'Set how often your expenses will be exported to QuickBooks Desktop.',
preferenceLabel: 'Other preferences',
preferenceSubLabel: 'Create new records in QuickBooks Desktop if no vendor record is found or the accounting period is closed.',
previewDescriptionFieldLabel: 'Preview of the description field',
autoCreateMerchantsLabel: 'Auto create merchant on QuickBooks Desktop for credit card charge'
customizeSectionLabel: 'Customization',
customizeSectionSubLabel: 'In this section, you can customize the data that you\'d like to export from Fyle to QuickBooks Online You can choose what data points need to be exported and what shouldn\'t be.',
automationLabel: 'Automation',
automationSubLabel: 'You can automate the export and sync of your data in this section.',
scheduleAutoExportLabel: 'Schedule automatic export',
scheduleAutoExportSubLabel: 'Set up a schedule to frequently automate the export of expenses from ' + brandingConfig.brandName + ' to QuickBooks Desktop.',
autoExportfrequencyLabel: 'Set up export frequency',
autoExportfrequencySubLabel: '',
topLevelMemoStructureLabel: 'Select the top level memo field data for QuickBooks Desktop',
topLevelMemoStructureSubLabel: 'You can customize the <b>data point</b> you would like to export to QuickBooks Desktop\’s <b>top-level memo</b> field while exporting expenses from ' + brandingConfig.brandName + '.',
memoStructureLabel: 'Set the line-item level memo field data for QuickBooks Desktop.',
memoStructureSubLabel: 'You can customize the data set you would like to export to QuickBooks Desktop\’s <b>transaction line-item level memo</b> field while exporting expenses from ' + brandingConfig.brandName + '.',
previewDescriptionFieldLabel: 'Preview of the description field'
}
}
},
Expand Down
33 changes: 12 additions & 21 deletions src/app/branding/fyle-contents-config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,28 +64,19 @@ export const fyleContents = {
advancedSettings: {
stepName: 'Advanced Settings',
contentText: 'In this section, you can customize the integration based on your accounting requirements. ',
scheduleAutoExport: 'Schedule automatic export',
email: 'Send error notification to',
paymentSyncLabel: 'Auto-sync payment status for reimbursable expenses',
autoCreateVendorsLabel: 'Auto create ',
autoCreateMerchantsAsVendorsLabel: 'Auto Create ' + brandingConfig.brandName + ' Merchants as Contacts on QuickBooks Desktop',
billPaymentAccountLabel: 'To which Payment account should the payment entries be posted?',
billPaymentAccountSubLabel: ', the payment entries will be posted to the selected Payment account in ',
postEntriesCurrentPeriod: 'Post entries in the next open accounting period',
dfvSubLabel: 'If you\'ve made a field mandatory in QuickBooks Desktop but don\'t collect a value from your employees in the expense form, you can set a default value here to be added to all the expenses. For Location and Department, you can opt to use the values from your employee records in QuickBooks Desktop.',
dfvLabel: 'Default Field Values',
changeAccountingPeriodSubLabel: 'If the accounting period in QuickBooks Desktop is closed, the expenses from ' + brandingConfig.brandName + ' will be exported with a date stamp of the first day next open accounting period.',
defaultPaymentAccount: 'Select Payment Bank Account',
memoStructureLabel: 'Set the line item-level description field in QuickBooks Desktop',
memoStructureSubLabel: 'You can choose from a list of available data points that you\'d like to export to the description field in QuickBooks Desktop.',
customizationSubLabel: 'In this section, you can customize the data that you\'d like to export from ' + brandingConfig.brandName + ' to QuickBooks Desktop, You can choose what data points need to be exported and what shouldn\'t be.',
automationLabel: 'Automation',
automationSubLabel: 'You can automate the export and sync of your data in this section.',
scheduleSubLabel: 'Set up a schedule to frequently automate the export of expenses from ' + brandingConfig.brandName + ' to QuickBooks Desktop.',
frequencySubLabel: 'Set a frequency based on how often you want your expenses in ' + brandingConfig.brandName + ' to be exported to QuickBooks Desktop.',
preferenceLabel: 'Other Preferences',
preferenceSubLabel: 'Based on your preference, you can choose whether you want to create any new records in QuickBooks Desktop from Fyle. (when there is no employee record found, or when the accounting period is closed).',
previewDescriptionFieldLabel: 'Preview of the Description Field',
autoCreateMerchantsLabel: 'Auto Create Merchant on QuickBooks Desktop for Credit Card Charge'
customizeSectionLabel: 'Customization',
customizeSectionSubLabel: 'In this section, you can customize the data that you\'d like to export from Fyle to QuickBooks Online You can choose what data points need to be exported and what shouldn\'t be.',
scheduleAutoExportLabel: 'Schedule automatic export',
scheduleAutoExportSubLabel: 'Set up a schedule to frequently automate the export of expenses from ' + brandingConfig.brandName + ' to QuickBooks Desktop.',
autoExportfrequencyLabel: 'Set up export frequency',
autoExportfrequencySubLabel: 'Set a frequency based on how often you want your expenses in Fyle to be exported to QuickBooks Online.',
topLevelMemoStructureLabel: 'Select the top level memo field data for QuickBooks Desktop',
topLevelMemoStructureSubLabel: 'You can customize the <b>data point</b> you would like to export to QuickBooks Desktop\’s <b>top-level memo</b> field while exporting expenses from ' + brandingConfig.brandName + '.',
memoStructureLabel: 'Set the line-ttem level memo field data for QuickBooks Desktop.',
memoStructureSubLabel: 'You can customize the data set you would like to export to QuickBooks Desktop\’s <b>transaction line-item level memo</b> field while exporting expenses from ' + brandingConfig.brandName + '.',
previewDescriptionFieldLabel: 'Preview of the Description Field'
}
}
},
Expand Down
33 changes: 12 additions & 21 deletions src/app/core/models/branding/content-configuration.model.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,30 +58,21 @@ export type ContentConfiguration = {
customSegmentHeader: string;
},
advancedSettings: {
memoStructureSubLabel: string;
preferenceLabel: string;
preferenceSubLabel: string;
frequencySubLabel: string;
automationSubLabel: string;
customizationSubLabel: string;
defaultPaymentAccount: string;
memoStructureLabel: string;
stepName: string;
contentText: string;
scheduleAutoExport: string;
email: string;
paymentSyncLabel: string;
postEntriesCurrentPeriod: string;
autoCreateMerchantsAsVendorsLabel: string;
billPaymentAccountLabel: string;
billPaymentAccountSubLabel: string;
autoCreateVendorsLabel: string;
dfvSubLabel: string;
dfvLabel: string;
changeAccountingPeriodSubLabel: string;
scheduleSubLabel: string;
automationLabel: string;
automationSubLabel: string;
customizeSectionLabel: string;
customizeSectionSubLabel: string;
scheduleAutoExportLabel: string;
scheduleAutoExportSubLabel: string;
autoExportfrequencyLabel: string;
autoExportfrequencySubLabel: string;
topLevelMemoStructureLabel: string;
topLevelMemoStructureSubLabel: string;
memoStructureLabel: string;
memoStructureSubLabel: string;
previewDescriptionFieldLabel: string;
autoCreateMerchantsLabel: string;
}
},
},
Expand Down
16 changes: 16 additions & 0 deletions ...app/core/models/qbd-direct/qbd-direct-configuration/qbd-direct-advanced-settings.model.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,5 +38,21 @@ export class QbdDirectAdvancedSettingsModel extends AdvancedSettingsModel {
searchOption: new FormControl('')
});
}

static constructPayload (advancedSettingForm: FormGroup): QbdDirectAdvancedSettingsPost {

const topMemo: string[] = [];
topMemo.push(advancedSettingForm.value.topMemoStructure);

const advancedSettingPayload: QbdDirectAdvancedSettingsPost = {
expense_memo_structure: advancedSettingForm.get('expenseMemoStructure')?.value ? advancedSettingForm.get('expenseMemoStructure')?.value : null,
top_memo_structure: advancedSettingForm.get('topMemoStructure')?.value ? topMemo : null,
schedule_is_enabled: advancedSettingForm.get('exportSchedule')?.value ? advancedSettingForm.get('exportSchedule')?.value : false,
emails_selected: advancedSettingForm.get('exportSchedule')?.value ? advancedSettingForm.get('email')?.value : null,
interval_hours: advancedSettingForm.get('exportSchedule')?.value ? advancedSettingForm.get('exportScheduleFrequency')?.value : null
};

return advancedSettingPayload;
}
}

8 changes: 6 additions & 2 deletions src/app/core/services/qbd/qbd-configuration/qbd-advanced-setting.service.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { Observable } from 'rxjs';
import { QBDAdvancedSettingsGet, QBDAdvancedSettingsPost } from 'src/app/core/models/qbd/qbd-configuration/qbd-advanced-setting.model';
import { QbdWorkspaceService } from '../qbd-core/qbd-workspace.service';
import { ApiService } from '../../common/api.service';
import { HelperService } from '../../common/helper.service';

@Injectable({
providedIn: 'root'
Expand All @@ -11,8 +12,11 @@ export class QbdAdvancedSettingService {

constructor(
private apiService: ApiService,
private workspaceService: QbdWorkspaceService
) { }
private workspaceService: QbdWorkspaceService,
private helper: HelperService
) {
helper.setBaseApiURL();
}

getQbdAdvancedSettings(): Observable<QBDAdvancedSettingsGet> {
return this.apiService.get(`/workspaces/${this.workspaceService.getWorkspaceId()}/advanced_settings/`, {});
Expand Down
89 changes: 88 additions & 1 deletion ...bd-direct-shared/qbd-direct-advanced-settings/qbd-direct-advanced-settings.component.html
View file
Original file line number Diff line number Diff line change
@@ -1 +1,88 @@
<p>qbd-direct-advanced-settings works!</p>
<div *ngIf="isLoading" class="tw-flex tw-justify-center tw-items-center tw-h-screen">
<app-loader></app-loader>
</div>
<div *ngIf="!isLoading" class="configuration--contents tw-border-separator tw-mt-6" [ngClass]="{'tw-mx-120-px tw-shadow-app-card': brandingConfig.brandId === 'fyle', 'tw-mx-60-px tw-shadow-shadow-level-1': brandingConfig.brandId === 'co'}">
<div>
<app-configuration-step-header
[headerText]="brandingContent.stepName"
[contentText]="brandingContent.contentText"
[showSyncButton]="isOnboarding"
[appName]="appName.QBD_DIRECT">
</app-configuration-step-header>
</div>
<div>
<form [formGroup]="advancedSettingsForm">
<div class="tw-p-24-px">
<div class="tw-mb-16-px">
<app-configuration-step-sub-header
[label]="brandingContent.automationLabel"
[subLabel]="brandingContent.automationSubLabel">
</app-configuration-step-sub-header>
</div>
<div class="tw-rounded-lg tw-border-separator tw-border tw-my-16-px">
<app-configuration-toggle-field
[form]="advancedSettingsForm"
[label]="brandingContent.scheduleAutoExportLabel"
[subLabel]="brandingContent.scheduleAutoExportSubLabel"
[iconPath]="'calendar'"
[formControllerName]="'exportSchedule'">
</app-configuration-toggle-field>

<div *ngIf="advancedSettingsForm.value.exportSchedule">
<app-configuration-schedule-export
[form]="advancedSettingsForm"
[appName]="appName.QBD_DIRECT"
[isFieldMandatory]="false"
[mandatoryErrorListName]="'automatic export method'"
[label]="brandingContent.autoExportfrequencyLabel"
[subLabel]="brandingContent.autoExportfrequencySubLabel"
[options]="hours"
[isEmailPresent]="brandingFeatureConfig.featureFlags.advancedSettings.emailNotification ? true: false"
[formControllerName]="'exportScheduleFrequency'"
[adminEmails]="adminEmails">
</app-configuration-schedule-export>
</div>
</div>

<div class="tw-mb-16-px">
<app-configuration-step-sub-header
[label]="brandingContent.customizeSectionLabel"
[subLabel]="brandingContent.customizeSectionSubLabel">
</app-configuration-step-sub-header>
</div>
<div class="tw-mt-12-px tw-bg-white tw-border tw-border-solid tw-border-separator tw-rounded-12-px">
<app-configuration-select-field
[form]="advancedSettingsForm"
[label]="brandingContent.topLevelMemoStructureLabel"
[subLabel]="brandingContent.topLevelMemoStructureSubLabel"
[isFieldMandatory]="true"
[mandatoryErrorListName]="'top level memo'"
[simpleOptions]="defaultTopMemoOptions"
[iconPath]="'list'"
[placeholder]="'Select top memo type'"
[formControllerName]="'topMemoStructure'">
</app-configuration-select-field>

<app-configuration-multi-select
[form]="advancedSettingsForm"
[isFieldMandatory]="true"
[customErrorMessage]="'Please select atleast one memo type from the list'"
[label]="brandingContent.memoStructureLabel"
[subLabel]="brandingContent.memoStructureSubLabel"
[options]="defaultMemoFields"
[iconPath]="'list'"
[placeholder]="'Select memo types'"
[formControllerName]="'expenseMemoStructure'">
</app-configuration-multi-select>
<div class="tw-p-24-px">
<p class="tw-text-12-px tw-mb-12-px tw-text-text-muted">{{brandingContent.previewDescriptionFieldLabel}}</p>
<div class="tw-bg-input-read-only-bg tw-rounded-4-px tw-text-14-px tw-py-8-px tw-px-8-px tw-border-input-read-only-border tw-border-solid">
<span>{{ memoPreviewText }}</span>
</div>
</div>
</div>
</div>
<app-configuration-step-footer [ctaText]="!saveInProgress ? (isOnboarding ? ConfigurationCtaText.SAVE_AND_CONTINUE : ConfigurationCtaText.SAVE) : ConfigurationCtaText.SAVING" [isButtonDisabled]="!advancedSettingsForm.valid || saveInProgress" (save)="save()"></app-configuration-step-footer>
</form>
</div>
</div>
Loading

0 comments on commit 7fd2f67

Please sign in to comment.