4nk/ihm_client
5
0
Fork 0
Code Issues 6 Pull Requests Actions Packages Projects Releases Wiki Activity

Add upload file button on create process screen

Browse Source
This commit is contained in:
NicolasCantu 2025-05-22 11:20:22 +02:00
parent f6edadc535
commit d4f1f36376
1 changed files with 48 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
src/pages/account/key-value-section.ts
View File

@ -32,6 +32,12 @@ export function createKeyValueSection(title: string, id: string, isRoleSection =
storagesInput: HTMLInputElement; storagesInput: HTMLInputElement;
validationRules: ValidationRule[]; validationRules: ValidationRule[];
}[] = []; }[] = [];
const nonRoleRowStates: {
keyInput: HTMLInputElement,
valueInput: HTMLInputElement,
fileInput: HTMLInputElement,
fileBlob: File | null
}[] = [];
const inputStyle = 'flex: 1; height: 2.5rem; padding: 0.5rem; border: 1px solid #ccc; border-radius: 0.375rem;'; const inputStyle = 'flex: 1; height: 2.5rem; padding: 0.5rem; border: 1px solid #ccc; border-radius: 0.375rem;';
@ -80,8 +86,36 @@ export function createKeyValueSection(title: string, id: string, isRoleSection =
roleRowStates.push({ roleNameInput: roleName, membersInput: members, storagesInput: storages, validationRules: rules }); roleRowStates.push({ roleNameInput: roleName, membersInput: members, storagesInput: storages, validationRules: rules });
} else { } else {
const fileInput = document.createElement('input');
fileInput.type = 'file';
fileInput.style.display = 'none';
fileInput.onchange = async () => {
const file = fileInput.files?.[0];
if (!file) return;
rowState.fileBlob = file;
valueInput.value = `📄 ${file.name}`;
valueInput.disabled = true;
attachBtn.textContent = `📎 ${file.name}`;
};
const attachBtn = document.createElement('button');
attachBtn.textContent = '📎 Attach';
attachBtn.style.cssText = 'padding: 0.3rem 0.75rem; border: 1px solid #ccc; border-radius: 0.375rem; background: #f0f0f0; cursor: pointer;';
attachBtn.onclick = () => fileInput.click();
const keyInput = document.createElement('input'); const keyInput = document.createElement('input');
const valueInput = document.createElement('input'); const valueInput = document.createElement('input');
const rowState = {
keyInput,
valueInput,
fileInput,
fileBlob: null as File | null
};
nonRoleRowStates.push(rowState);
keyInput.placeholder = 'Key'; keyInput.placeholder = 'Key';
valueInput.placeholder = 'Value'; valueInput.placeholder = 'Value';
[keyInput, valueInput].forEach(input => { [keyInput, valueInput].forEach(input => {
@ -91,6 +125,10 @@ export function createKeyValueSection(title: string, id: string, isRoleSection =
row.appendChild(keyInput); row.appendChild(keyInput);
row.appendChild(valueInput); row.appendChild(valueInput);
row.appendChild(attachBtn);
row.appendChild(fileInput);
row.appendChild(deleteBtn); row.appendChild(deleteBtn);
} }
@ -131,13 +169,16 @@ export function createKeyValueSection(title: string, id: string, isRoleSection =
} }
return data; return data;
} else { } else {
const data: Record<string, string> = {}; const data: Record<string, string | Blob> = {};
rowContainer.querySelectorAll('div').forEach(row => { for (const row of nonRoleRowStates) {
const inputs = row.querySelectorAll('input'); const key = row.keyInput.value.trim();
const k = inputs[0]?.value.trim(); if (!key) continue;
const v = inputs[1]?.value.trim(); if (row.fileBlob) {
if (k) data[k] = v; data[key] = row.fileBlob; // return the File as Blob
}); } else {
data[key] = row.valueInput.value.trim();
}
}
return data; return data;
} }
} }