in extensions/agent/src/dialogs/operatorDialog.ts [93:380]
private initializeGeneralTab() {
this.generalTab.registerContent(async view => {
this.nameTextBox = view.modelBuilder.inputBox().withProps({
ariaLabel: OperatorDialog.NameLabel,
placeHolder: OperatorDialog.NameLabel
}).component();
this.nameTextBox.value = this.model.name;
this.emailNameTextBox = view.modelBuilder.inputBox().withProps({
ariaLabel: OperatorDialog.EmailNameTextLabel,
placeHolder: OperatorDialog.EmailNameTextLabel
}).component();
this.emailNameTextBox.value = this.model.emailAddress;
this.pagerEmailNameTextBox = view.modelBuilder.inputBox().withProps({
ariaLabel: OperatorDialog.PagerEmailNameTextLabel,
placeHolder: OperatorDialog.PagerEmailNameTextLabel
}).component();
this.pagerEmailNameTextBox.value = this.model.pagerAddress;
this.enabledCheckBox = view.modelBuilder.checkBox()
.withProps({
label: OperatorDialog.EnabledCheckboxLabel
}).component();
this.enabledCheckBox.checked = this.model.enabled;
this.pagerMondayCheckBox = view.modelBuilder.checkBox()
.withProps({
label: OperatorDialog.PagerMondayCheckBoxLabel
}).component();
this.pagerMondayCheckBox.onChanged(() => {
if (this.pagerMondayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = true;
this.weekdayPagerEndTimeInput.enabled = true;
} else {
if (!this.pagerTuesdayCheckBox.checked && !this.pagerWednesdayCheckBox.checked &&
!this.pagerThursdayCheckBox.checked && !this.pagerFridayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = false;
this.weekdayPagerEndTimeInput.enabled = false;
}
}
});
this.pagerTuesdayCheckBox = view.modelBuilder.checkBox()
.withProps({
label: OperatorDialog.PagerTuesdayCheckBoxLabel
}).component();
this.pagerTuesdayCheckBox.onChanged(() => {
if (this.pagerTuesdayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = true;
this.weekdayPagerEndTimeInput.enabled = true;
} else {
if (!this.pagerMondayCheckBox.checked && !this.pagerWednesdayCheckBox.checked &&
!this.pagerThursdayCheckBox.checked && !this.pagerFridayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = false;
this.weekdayPagerEndTimeInput.enabled = false;
}
}
});
this.pagerWednesdayCheckBox = view.modelBuilder.checkBox()
.withProps({
label: OperatorDialog.PagerWednesdayCheckBoxLabel
}).component();
this.pagerWednesdayCheckBox.onChanged(() => {
if (this.pagerWednesdayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = true;
this.weekdayPagerEndTimeInput.enabled = true;
} else {
if (!this.pagerMondayCheckBox.checked && !this.pagerTuesdayCheckBox.checked &&
!this.pagerThursdayCheckBox.checked && !this.pagerFridayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = false;
this.weekdayPagerEndTimeInput.enabled = false;
}
}
});
this.pagerThursdayCheckBox = view.modelBuilder.checkBox()
.withProps({
label: OperatorDialog.PagerThursdayCheckBoxLabel
}).component();
this.pagerThursdayCheckBox.onChanged(() => {
if (this.pagerThursdayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = true;
this.weekdayPagerEndTimeInput.enabled = true;
} else {
if (!this.pagerMondayCheckBox.checked && !this.pagerWednesdayCheckBox.checked &&
!this.pagerTuesdayCheckBox.checked && !this.pagerFridayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = false;
this.weekdayPagerEndTimeInput.enabled = false;
}
}
});
this.weekdayPagerStartTimeInput = view.modelBuilder.inputBox()
.withProps({
inputType: 'time',
placeHolder: '08:00:00',
}).component();
this.weekdayPagerStartTimeInput.enabled = false;
let weekdayStartInputContainer = view.modelBuilder.formContainer()
.withFormItems([{
component: this.weekdayPagerStartTimeInput,
title: OperatorDialog.WorkdayBeginLabel
}]).component();
this.weekdayPagerEndTimeInput = view.modelBuilder.inputBox()
.withProps({
inputType: 'time',
placeHolder: '06:00:00'
}).component();
this.weekdayPagerEndTimeInput.enabled = false;
let weekdayEndInputContainer = view.modelBuilder.formContainer()
.withFormItems([{
component: this.weekdayPagerEndTimeInput,
title: OperatorDialog.WorkdayEndLabel
}]).component();
this.pagerFridayCheckBox = view.modelBuilder.checkBox()
.withProps({
label: OperatorDialog.PagerFridayCheckBoxLabel
}).component();
this.pagerFridayCheckBox.onChanged(() => {
if (this.pagerFridayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = true;
this.weekdayPagerEndTimeInput.enabled = true;
} else {
if (!this.pagerMondayCheckBox.checked && !this.pagerWednesdayCheckBox.checked &&
!this.pagerThursdayCheckBox.checked && !this.pagerTuesdayCheckBox.checked) {
this.weekdayPagerStartTimeInput.enabled = false;
this.weekdayPagerEndTimeInput.enabled = false;
}
}
});
let pagerFridayCheckboxContainer = view.modelBuilder.flexContainer()
.withLayout({
flexFlow: 'row',
alignItems: 'baseline',
width: '100%'
}).withItems([this.pagerFridayCheckBox, weekdayStartInputContainer, weekdayEndInputContainer])
.component();
this.pagerSaturdayCheckBox = view.modelBuilder.checkBox()
.withProps({
label: OperatorDialog.PagerSaturdayCheckBoxLabel
}).component();
this.pagerSaturdayCheckBox.onChanged(() => {
if (this.pagerSaturdayCheckBox.checked) {
this.saturdayPagerStartTimeInput.enabled = true;
this.saturdayPagerEndTimeInput.enabled = true;
} else {
this.saturdayPagerStartTimeInput.enabled = false;
this.saturdayPagerEndTimeInput.enabled = false;
}
});
this.saturdayPagerStartTimeInput = view.modelBuilder.inputBox()
.withProps({
inputType: 'time',
placeHolder: '08:00:00'
}).component();
this.saturdayPagerStartTimeInput.enabled = false;
let saturdayStartInputContainer = view.modelBuilder.formContainer()
.withFormItems([{
component: this.saturdayPagerStartTimeInput,
title: OperatorDialog.WorkdayBeginLabel
}]).component();
this.saturdayPagerEndTimeInput = view.modelBuilder.inputBox()
.withProps({
inputType: 'time',
placeHolder: '06:00:00'
}).component();
this.saturdayPagerEndTimeInput.enabled = false;
let saturdayEndInputContainer = view.modelBuilder.formContainer()
.withFormItems([{
component: this.saturdayPagerEndTimeInput,
title: OperatorDialog.WorkdayEndLabel
}]).component();
let pagerSaturdayCheckboxContainer = view.modelBuilder.flexContainer()
.withLayout({
flexFlow: 'row',
alignItems: 'baseline'
}).withItems([this.pagerSaturdayCheckBox, saturdayStartInputContainer, saturdayEndInputContainer])
.component();
this.pagerSundayCheckBox = view.modelBuilder.checkBox()
.withProps({
label: OperatorDialog.PagerSundayCheckBoxLabel
}).component();
this.pagerSundayCheckBox.onChanged(() => {
if (this.pagerSundayCheckBox.checked) {
this.sundayPagerStartTimeInput.enabled = true;
this.sundayPagerEndTimeInput.enabled = true;
} else {
this.sundayPagerStartTimeInput.enabled = false;
this.sundayPagerEndTimeInput.enabled = false;
}
});
this.sundayPagerStartTimeInput = view.modelBuilder.inputBox()
.withProps({
inputType: 'time',
placeHolder: '08:00:00'
}).component();
this.sundayPagerStartTimeInput.enabled = false;
let sundayStartInputContainer = view.modelBuilder.formContainer()
.withFormItems([{
component: this.sundayPagerStartTimeInput,
title: OperatorDialog.WorkdayBeginLabel
}]).component();
this.sundayPagerEndTimeInput = view.modelBuilder.inputBox()
.withProps({
inputType: 'time',
placeHolder: '06:00:00'
}).component();
this.sundayPagerEndTimeInput.enabled = false;
let sundayEndInputContainer = view.modelBuilder.formContainer()
.withFormItems([{
component: this.sundayPagerEndTimeInput,
title: OperatorDialog.WorkdayEndLabel
}]).component();
let pagerSundayCheckboxContainer = view.modelBuilder.flexContainer()
.withLayout({
flexFlow: 'row',
alignItems: 'baseline'
}).withItems([this.pagerSundayCheckBox, sundayStartInputContainer, sundayEndInputContainer])
.component();
let formModel = view.modelBuilder.formContainer()
.withFormItems([{
component: this.nameTextBox,
title: OperatorDialog.NameLabel
}, {
component: this.enabledCheckBox,
title: ''
}, {
component: this.emailNameTextBox,
title: OperatorDialog.EmailNameTextLabel
}, {
component: this.pagerEmailNameTextBox,
title: OperatorDialog.PagerEmailNameTextLabel
}, {
components: [{
component: this.pagerMondayCheckBox,
title: ''
}, {
component: this.pagerTuesdayCheckBox,
title: ''
}, {
component: this.pagerWednesdayCheckBox,
title: ''
}, {
component: this.pagerThursdayCheckBox,
title: ''
}],
title: OperatorDialog.PagerDutyScheduleLabel
}, {
component: pagerFridayCheckboxContainer,
title: ''
}, {
component: view.modelBuilder.separator().component(),
title: ''
}, {
component: pagerSaturdayCheckboxContainer,
title: ''
}, {
component: view.modelBuilder.separator().component(),
title: ''
}, {
component: pagerSundayCheckboxContainer,
title: ''
}
]).withLayout({ width: '100%' }).component();
await view.initializeModel(formModel);
});
}