hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-13 13:03:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

127705: Update dynamic list to bootstrap 5

Browse Source
This commit is contained in:
Joran De Braekeleer
2025-05-02 16:41:11 +02:00
parent b00f489d09
commit 46a89533f0
2 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.html
View File

@@ -9,8 +9,8 @@
@for (columnItems of items; track columnItems) { @for (columnItems of items; track columnItems) {
<div class="col-sm"> <div class="col-sm">
@for (item of columnItems; track item) { @for (item of columnItems; track item) {
<div class="custom-control custom-checkbox"> <div class="form-check">
<input type="checkbox" class="custom-control-input" <input type="checkbox" class="form-check-input"
[attr.aria-labelledby]="'label_' + model.id" [attr.aria-labelledby]="'label_' + model.id"
[attr.tabindex]="item.index" [attr.tabindex]="item.index"
[checked]="item.value" [checked]="item.value"
@@ -21,7 +21,7 @@
(blur)="onBlur($event)" (blur)="onBlur($event)"
(change)="onChange($event)" (change)="onChange($event)"
(focus)="onFocus($event)"/> (focus)="onFocus($event)"/>
<label class="custom-control-label" <label class="form-check-label"
[class.disabled]="model.disabled" [class.disabled]="model.disabled"
[ngClass]="model.layout.element?.control" [ngClass]="model.layout.element?.control"
[for]="item.id"> [for]="item.id">
@@ -45,8 +45,8 @@
@for (columnItems of items; track columnItems) { @for (columnItems of items; track columnItems) {
<div class="col-sm"> <div class="col-sm">
@for (item of columnItems; track item) { @for (item of columnItems; track item) {
<div class="custom-control custom-radio"> <div class="form-check">
<input type="radio" class="custom-control-input" <input type="radio" class="form-check-input"
[checked]="item.value" [checked]="item.value"
[id]="item.id" [id]="item.id"
[name]="model.id" [name]="model.id"
@@ -54,7 +54,7 @@
[value]="item.index" [value]="item.index"
(blur)="onBlur($event)" (blur)="onBlur($event)"
(focus)="onFocus($event)"/> (focus)="onFocus($event)"/>
<label class="custom-control-label" <label class="form-check-label"
[class.disabled]="model.disabled" [class.disabled]="model.disabled"
[ngClass]="model.layout.element?.control" [ngClass]="model.layout.element?.control"
[for]="item.id"> [for]="item.id">

12
src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.spec.ts
View File

@@ -179,8 +179,8 @@ describe('DsDynamicListComponent test suite', () => {
}); });
it('should set model value properly when a checkbox option is selected', () => { it('should set model value properly when a checkbox option is selected', () => {
const de = listFixture.debugElement.queryAll(By.css('div.custom-checkbox')); const de = listFixture.debugElement.queryAll(By.css('div.form-check'));
const items = de[0].queryAll(By.css('input.custom-control-input')); const items = de[0].queryAll(By.css('input.form-check-input'));
const item = items[0]; const item = items[0];
modelValue = [Object.assign(new VocabularyEntry(), { authority: 1, display: 'one', value: 1 })]; modelValue = [Object.assign(new VocabularyEntry(), { authority: 1, display: 'one', value: 1 })];
@@ -229,8 +229,8 @@ describe('DsDynamicListComponent test suite', () => {
}); });
it('should set model value properly when a checkbox option is deselected', () => { it('should set model value properly when a checkbox option is deselected', () => {
const de = listFixture.debugElement.queryAll(By.css('div.custom-checkbox')); const de = listFixture.debugElement.queryAll(By.css('div.form-check'));
const items = de[0].queryAll(By.css('input.custom-control-input')); const items = de[0].queryAll(By.css('input.form-check-input'));
const item = items[0]; const item = items[0];
modelValue = []; modelValue = [];
@@ -267,8 +267,8 @@ describe('DsDynamicListComponent test suite', () => {
}); });
it('should set model value when a radio option is selected', () => { it('should set model value when a radio option is selected', () => {
const de = listFixture.debugElement.queryAll(By.css('div.custom-radio')); const de = listFixture.debugElement.queryAll(By.css('div.form-check'));
const items = de[0].queryAll(By.css('input.custom-control-input')); const items = de[0].queryAll(By.css('input.form-check-input'));
const item = items[0]; const item = items[0];
modelValue = Object.assign(new VocabularyEntry(), { authority: 1, display: 'one', value: 1 }); modelValue = Object.assign(new VocabularyEntry(), { authority: 1, display: 'one', value: 1 });