Fix: Tag Interface Delete Button #104256

Manually merged
Sybren A. Stüvel merged 39 commits from Evelinealy/flamenco:tag-interface into main 2023-11-02 16:13:14 +01:00
Showing only changes of commit 0161e9b028 - Show all commits

View File

@ -121,35 +121,20 @@ export default {
const tag_options = {
columns: [
{
title: "",
headerHozAlign: "right",
formatter: (cell) => {
const button = document.createElement("button");
button.classList.add("remove-tag-button");
button.innerHTML = "X";
button.addEventListener("click", () => {
const tag = cell.getRow().getData();
this.deleteTag(tag);
});
return button;
},
headerSort: false,
vertAlign: "center",
},
{
title: "Name",
field: "name",
sorter: "string",
editor: "input",
vertAlign: "center",
title: 'Name',
field: 'name',
sorter: 'string',
editor: 'input',
vertAlign: 'center',
widthGrow: 1,
},
{
title: 'Description',
field: 'description',
sorter: 'string',
editor: 'input',
vertAlign: "center",
vertAlign: 'center',
widthGrow: 2,
dr.sybren marked this conversation as resolved Outdated

Add this column to the end, so that it has the same layout as the job blocklist (there the is on the right as well).

Add this column to the end, so that it has the same layout as the job blocklist (there the ❌ is on the right as well).
formatter(cell) {
const cellValue = cell.getData().description;
@ -159,8 +144,27 @@ export default {
return cellValue;
},
},
{
title: '',
headerHozAlign: 'right',
width: 60,
formatter: (cell) => {
const button = document.createElement('button');
button.classList.add('remove-tag-button');
button.innerHTML = '❌';
button.addEventListener('click', () => {
const tag = cell.getRow().getData();
this.deleteTag(tag);
});
return button;
},
headerSort: false,
vertAlign: 'center',
},
],
layout: 'fitData',
layout: 'fitColumns',
dr.sybren marked this conversation as resolved Outdated

Not sure if a fixed width is going to work well here, especially when the window gets resized.

Not sure if a fixed width is going to work well here, especially when the window gets resized.
layoutColumnsOnNewData: true,
height: '82%',
selectable: false,