CSS improvements

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>

company/src/main/java/de/srsoftware/umbrella/company/CompanyModule.java

@@ -2,6 +2,7 @@
 package de.srsoftware.umbrella.company;
 
 import static de.srsoftware.umbrella.company.Constants.CONFIG_DATABASE;
+import static de.srsoftware.umbrella.company.Constants.NEXT_CUSTOMER_NUMBER;
 import static de.srsoftware.umbrella.core.ConnectionProvider.connect;
 import static de.srsoftware.umbrella.core.Constants.*;
 import static de.srsoftware.umbrella.core.ModuleRegistry.*;
@@ -73,7 +74,12 @@ public class CompanyModule extends BaseHandler implements CompanyService {
 			return switch (head){
 				case LIST -> getCompanyList(user.get(),ex);
 				case null,
-				default -> super.doGet(path,ex);
+				default -> {
+					try {
+						yield getCompany(user.get(), path, Long.parseLong(head), ex);
+					} catch (NumberFormatException ignored){}
+					yield super.doGet(path,ex);
+				}
 			};
 		} catch (UmbrellaException e) {
 			return send(ex,e);
@@ -124,6 +130,14 @@ public class CompanyModule extends BaseHandler implements CompanyService {
 		return companyDb.load(companyId);
 	}
 
+	private boolean getCompany(UmbrellaUser user, Path path, long companyId, HttpExchange ex) throws IOException {
+		return switch (path.pop()){
+			case NEXT_CUSTOMER_NUMBER -> getNextCustomerNumber(user, companyId, ex);
+			case null, default -> super.doGet(path,ex);
+		};
+
+	}
+
 	private boolean getCompanyList(UmbrellaUser user, HttpExchange ex) throws IOException, UmbrellaException {
 		var result = new HashMap<Long,Map<String,Object>>();
 		for (var entry : listCompaniesOf(user).entrySet()) result.put(entry.getKey(),entry.getValue().toMap());
@@ -137,6 +151,13 @@ public class CompanyModule extends BaseHandler implements CompanyService {
 		return members;
 	}
 
+	private boolean getNextCustomerNumber(UmbrellaUser user, long companyId, HttpExchange ex) throws IOException {
+		var company = companyDb.load(companyId);
+		if (!membership(companyId,user.id())) throw forbidden("You are mot a member of company {0}",company.name());
+		var nextCustomerNumber = companyDb.getNextCustomerNumber(companyId);
+		return sendContent(ex,nextCustomerNumber);
+	}
+
 	@Override
 	public Map<Long,Company> listCompaniesOf(UmbrellaUser user) throws UmbrellaException {
 		return loadMembers(companyDb.listCompaniesOf(user.id()));
@@ -205,4 +226,9 @@ public class CompanyModule extends BaseHandler implements CompanyService {
 		var companies = companyDb.find(user.id(),keys);
 		return sendContent(ex,mapValues(companies));
 	}
+
+	@Override
+	public void saveNewCustomer(long companyId, String id) {
+		companyDb.saveNewCustomer(companyId, id);
+	}
 }

company/src/main/java/de/srsoftware/umbrella/company/Constants.java

@@ -6,6 +6,7 @@ public class Constants {
 
 	public static final String CONFIG_DATABASE = "umbrella.modules.company.database";
 	public static final String DISTINCT = "DISTINCT *";
+	public static final String NEXT_CUSTOMER_NUMBER = "next_customer_number";
 	public static final String TABLE_COMPANIES_USERS = "companies_users";
 	public static final String TABLE_COMPANIES = "companies";
 }

company/src/main/java/de/srsoftware/umbrella/company/SqliteDb.java

@@ -11,6 +11,7 @@ import static de.srsoftware.umbrella.core.Constants.*;
 import static de.srsoftware.umbrella.core.Field.*;
 import static de.srsoftware.umbrella.core.Field.COMPANY_ID;
 import static de.srsoftware.umbrella.core.exceptions.UmbrellaException.databaseException;
+import static de.srsoftware.umbrella.core.exceptions.UmbrellaException.unprocessable;
 import static java.lang.System.Logger.Level.ERROR;
 import static java.text.MessageFormat.format;
 
@@ -21,6 +22,7 @@ import de.srsoftware.umbrella.core.model.Company;
 import java.sql.Connection;
 import java.sql.SQLException;
 import java.util.*;
+import java.util.regex.Pattern;
 import org.json.JSONObject;
 
 public class SqliteDb extends BaseDb implements CompanyDb {
@@ -126,6 +128,24 @@ CREATE TABLE IF NOT EXISTS "companies" (
 		}
 	}
 
+	@Override
+	public String getNextCustomerNumber(long companyId) {
+		try {
+			var rs = select(LAST_CUSTOMER_NUMBER,CUSTOMER_NUMBER_PREFIX).from(TABLE_COMPANIES).where(ID,equal(companyId)).exec(db);
+			var last = 0L;
+			String prefix = null;
+			if (rs.next()){
+				last = rs.getLong(LAST_CUSTOMER_NUMBER);
+				prefix = rs.getString(CUSTOMER_NUMBER_PREFIX);
+			}
+			rs.close();
+			var next = last+1;
+			return prefix+next; // TODO: currently not taking growing number lengths into account, this should be resolved!
+		} catch (SQLException e) {
+			throw databaseException("Failed to load customer number settings for company {0}",companyId);
+		}
+	}
+
 	@Override
 	public HashMap<Long, Company> find(long userId, Collection<String> keys) {
 		try {
@@ -208,4 +228,18 @@ CREATE TABLE IF NOT EXISTS "companies" (
 			throw UmbrellaException.databaseException("Failed to save {0}…",company.name());
 		}
 	}
+
+	@Override
+	public void saveNewCustomer(long companyId, String id) {
+		var p = Pattern.compile("(?s)(.*?)(\\d+)$");
+		var m = p.matcher(id);
+		if (!m.matches()) throw unprocessable("{0} is not a valid customer id: it does not end with a number!");
+		String prefix = m.group(1);  // Prefix before last number
+		long number = Long.parseLong(m.group(2));  // The last numeric part
+		try {
+			update(TABLE_COMPANIES).set(LAST_CUSTOMER_NUMBER,CUSTOMER_NUMBER_PREFIX).where(ID,equal(companyId)).prepare(db).apply(number,prefix).close();
+		} catch (SQLException e) {
+			throw databaseException("Failed to update customer number counter for company {0}", companyId);
+		}
+	}
 }

company/src/main/java/de/srsoftware/umbrella/company/api/CompanyDb.java

@@ -18,9 +18,13 @@ public interface CompanyDb {
 
 	Collection<Long> getMembers(long companyId) throws UmbrellaException;
 
+	String getNextCustomerNumber(long companyId);
+
 	Map<Long,Company> listCompaniesOf(long id) throws UmbrellaException;
 
 	Company load(long companyId) throws UmbrellaException;
 
 	Company save(Company company);
+
+	void saveNewCustomer(long companyId, String id);
 }

contact/src/main/java/de/srsoftware/umbrella/contact/ContactDb.java

@@ -10,7 +10,7 @@ public interface ContactDb {
 
 	Map<Long,Contact> listContactsOf(long userId) throws UmbrellaException;
 
-	Contact load(long id, long userId);
+	Contact load(long contactId, long userId);
 
 	Contact save(Contact contact);
 

contact/src/main/java/de/srsoftware/umbrella/contact/ContactModule.java

@@ -114,6 +114,11 @@ public class ContactModule extends BaseHandler implements ContactService {
 		return sendContent(ex,mapValues(listContactsOf(user)));
 	}
 
+	@Override
+	public Contact load(long userId, long contactId) {
+		return contactDb.load(contactId,userId);
+	}
+
 	@Override
 	public Map<Long,Contact> listContactsOf(UmbrellaUser user) throws UmbrellaException {
 		return contactDb.listContactsOf(user.id());
@@ -130,4 +135,9 @@ public class ContactModule extends BaseHandler implements ContactService {
 		contactDb.setOwner(user.id(),contact);
 		return sendContent(ex,contact);
 	}
+
+	@Override
+	public Contact save(Contact contact) {
+		return contactDb.save(contact);
+	}
 }

contact/src/main/java/de/srsoftware/umbrella/contact/SqliteDb.java

@@ -87,14 +87,14 @@ public class SqliteDb extends BaseDb implements ContactDb{
 	}
 
 	@Override
-	public Contact load(long id, long userId) {
+	public Contact load(long contactId, long userId) {
 		try {
-			var rs = select(ALL).from(TABLE_CONTACTS).leftJoin(ID,TABLE_CONTACTS_USERS,CONTACT_ID).where(USER_ID,equal(userId)).where(ID,equal(id)).exec(db);
+			var rs = select(ALL).from(TABLE_CONTACTS).leftJoin(ID,TABLE_CONTACTS_USERS,CONTACT_ID).where(USER_ID,equal(userId)).where(ID,equal(contactId)).exec(db);
 			Contact contact = null;
 			if (rs.next()) contact = Contact.of(rs);
 			rs.close();
 			if (contact != null) return contact;
-			throw notFound("Failed to load contact with id = {0}",id);
+			throw notFound("Failed to load contact with id = {0}", contactId);
 		} catch (SQLException e) {
 			throw databaseException("Failed to load contacts of user {0}",userId);
 		}

core/src/main/java/de/srsoftware/umbrella/core/api/CompanyService.java

@@ -15,4 +15,6 @@ public interface CompanyService {
 	Map<Long,Company> listCompaniesOf(UmbrellaUser user) throws UmbrellaException;
 
 	boolean membership(long companyId, long userId) throws UmbrellaException;
+
+	void saveNewCustomer(long companyId, String id);
 }

core/src/main/java/de/srsoftware/umbrella/core/api/ContactService.java

@@ -8,4 +8,8 @@ import java.util.Map;
 
 public interface ContactService {
 	Map<Long, Contact> listContactsOf(UmbrellaUser user) throws UmbrellaException;
+
+	Contact load(long userId, long contactId);
+
+	Contact save(Contact contact);
 }

core/src/main/java/de/srsoftware/umbrella/core/model/Contact.java

@@ -3,6 +3,7 @@ package de.srsoftware.umbrella.core.model;
 
 import static de.srsoftware.umbrella.core.Constants.*;
 import static de.srsoftware.umbrella.core.exceptions.UmbrellaException.missingFieldException;
+import static java.text.MessageFormat.format;
 
 import de.srsoftware.tools.Mappable;
 import java.sql.ResultSet;
@@ -10,7 +11,21 @@ import java.sql.SQLException;
 import java.util.Map;
 import org.json.JSONObject;
 
-public record Contact(long id, String vcard) implements Mappable {
+public class Contact implements Mappable{
+	private final static String X_CUSTOMER_NUMBER = "X-CUSTOMER-NUMBER";
+
+	private long id;
+	private String vcard;
+
+	public Contact(long id, String vcard){
+		this.id    = id;
+		this.vcard = vcard;
+	}
+
+	public long id(){
+		return id;
+	}
+
 	public static Contact of(ResultSet rs) throws SQLException {
 		return new Contact(rs.getLong(ID),rs.getString(DATA));
 	}
@@ -21,8 +36,24 @@ public record Contact(long id, String vcard) implements Mappable {
 		return new Contact(id,vcard.replace(from, to));
 	}
 
+	public Contact setCustomerNumber(String customerNumber) {
+		if (vcard.contains(X_CUSTOMER_NUMBER)) {
+			var pattern = format("^{0}:.*",X_CUSTOMER_NUMBER);
+			var replacement = format("{0}:{1}",X_CUSTOMER_NUMBER,customerNumber);
+			vcard = vcard.replaceAll(pattern,replacement);
+		} else {
+			var index = vcard.lastIndexOf("\n");
+			vcard = format("{0}\r\n{1}:{2}{3}",vcard.substring(0,index),X_CUSTOMER_NUMBER,customerNumber,vcard.substring(index));
+		}
+		return this;
+	}
+
 	@Override
 	public Map<String, Object> toMap() {
 		return Map.of(ID,id,VCARD,vcard);
 	}
+
+	public String vcard(){
+		return vcard;
+	}
 }

core/src/main/java/de/srsoftware/umbrella/core/model/Customer.java

@@ -1,16 +1,14 @@
 /* © SRSoftware 2025 */
 package de.srsoftware.umbrella.core.model;
 
+import static de.srsoftware.tools.Optionals.emptyIfNull;
 import static de.srsoftware.umbrella.core.Constants.*;
 import static de.srsoftware.umbrella.core.Field.*;
 import static de.srsoftware.umbrella.core.exceptions.UmbrellaException.missingFieldException;
 
 import de.srsoftware.tools.Mappable;
 import de.srsoftware.umbrella.core.exceptions.UmbrellaException;
-import java.util.HashSet;
-import java.util.Map;
-import java.util.Objects;
-import java.util.Set;
+import java.util.*;
 import org.json.JSONObject;
 
 public final class Customer implements Mappable {
@@ -73,7 +71,7 @@ public final class Customer implements Mappable {
 		if (!json.has(ID) || !(json.get(ID) instanceof String id)) throw missingFieldException(ID);
 		if (!json.has(NAME) || !(json.get(NAME) instanceof String name)) throw missingFieldException(NAME);
 		if (!json.has(EMAIL) || !(json.get(EMAIL) instanceof String email)) throw missingFieldException(EMAIL);
-		if (!json.has(TAX_ID) || !(json.get(TAX_ID) instanceof String taxId)) throw missingFieldException(TAX_ID);
+		var taxId = json.has(TAX_ID) && json.get(TAX_ID) instanceof String tid ? tid : null;
 		var lang = json.has(LANGUAGE) && json.get(LANGUAGE) instanceof String l ? l : FALLBACK_LANG;
 		return new Customer(id,name,email,taxId,lang);
 	}
@@ -104,11 +102,11 @@ public final class Customer implements Mappable {
 
 	@Override
 	public Map<String, Object> toMap() {
-		return Map.of(
-				"id", id,
-				"name", name,
-				"email", email,
-				"tax_id", taxNumber
-		);
+		var map = new HashMap<String,Object>();
+		map.put("id", id);
+		map.put("name", name);
+		map.put("email", email);
+		map.put("tax_id", emptyIfNull(taxNumber));
+		return map;
 	}
 }

documents/src/main/java/de/srsoftware/umbrella/documents/Constants.java

@@ -15,6 +15,7 @@ public class Constants {
 	public static final String CLONE = "clone";
 	public static final String CONFIG_DATABASE = "umbrella.modules.document.database";
 	public static final String CONFIG_TEMPLATES = "umbrella.modules.document.templates";
+	public static final String CONTACT_ID = "contact_id";
 	public static final String CONTACTS = "contacts";
 	public static final String CUSTOMERS = "customers";
 

documents/src/main/java/de/srsoftware/umbrella/documents/DocumentApi.java

@@ -460,28 +460,37 @@ public class DocumentApi extends BaseHandler implements DocumentService {
 	private boolean postDocument(HttpExchange ex, UmbrellaUser user) throws IOException, UmbrellaException {
 		var json = json(ex);
 		if (!(json.has(SENDER) && json.get(SENDER) instanceof JSONObject senderData)) throw missingFieldException(SENDER);
-		if (!senderData.has(COMPANY) || !(senderData.get(COMPANY) instanceof Number companyId)) throw missingFieldException(COMPANY);
-
-		var company = companyService().get(companyId.longValue());
-		if (!companyService().membership(companyId.longValue(),user.id())) throw forbidden("You are mot a member of company {0}",company);
+		if (!senderData.has(COMPANY) || !(senderData.get(COMPANY) instanceof Number rawCompId)) throw missingFieldException(COMPANY);
+		var companyId = rawCompId.longValue();
+		var company = companyService().get(companyId);
+		if (!companyService().membership(companyId,user.id())) throw forbidden("You are mot a member of company {0}",company);
 
 		if (!json.has(CUSTOMER) || !(json.get(CUSTOMER) instanceof JSONObject customerData)) throw missingFieldException(CUSTOMER);
 		if (!json.has(TYPE) || !(json.get(TYPE) instanceof Number docTypeId)) throw missingFieldException(TYPE);
 		var type = db.getType(docTypeId.intValue());
 		var customer = Customer.of(customerData);
-		Template template = new Template(6,companyId.longValue(),"unknwon",null);
+		Template template = new Template(6,companyId,"unknwon",null);
 		String currency = company.currency();
 		String sep = company.decimalSeparator();
-		var settings = db.getCustomerSettings(companyId.longValue(),type,customer.id());
-		if (settings == null) settings = CustomerSettings.empty();
-		var companySettings = db.getCompanySettings(companyId.longValue(),type);
+		var settings = db.getCustomerSettings(companyId,type,customer.id());
+		var newCustomer = settings == null;
+		if (newCustomer) settings = CustomerSettings.empty();
+		var companySettings = db.getCompanySettings(companyId,type);
 		var nextNumber = companySettings.nextDocId();
 		String lastHead = settings.header();
 		String lastFooter = settings.footer();
 		var sender = Sender.of(senderData);
 		LOG.log(DEBUG,json.toString(2));
-		var doc = new Document(0,companyId.longValue(),nextNumber,type, LocalDate.now(), NEW,template,null,lastHead,lastFooter,currency,sep,sender,customer,new PositionList());
+		var doc = new Document(0,companyId,nextNumber,type, LocalDate.now(), NEW,template,null,lastHead,lastFooter,currency,sep,sender,customer,new PositionList());
 		var saved = db.save(doc);
+		if (newCustomer) {
+			if (customerData.get(CONTACT_ID) instanceof Number contactId) {
+				var contacts = contactService();
+				var contact = contacts.load(user.id(), contactId.longValue());
+				contacts.save(contact.setCustomerNumber(customer.id()));
+			}
+			companyService().saveNewCustomer(companyId,customer.id());
+		}
 		db.step(companySettings);
 		return sendContent(ex,saved);
 	}

frontend/src/Components/ContactSelector.svelte

@@ -26,23 +26,25 @@
                 contact.FN    = fn(contact.vcard);
                 contact.ORG   = org(contact.vcard);
                 const extras  = contact.vcard.match(/^X-.*:.+/gm);
-                for (let ex of extras){
-                    ex = extra(ex);
-                    switch (ex.name){
-                        case 'CUSTOMER-NUMBER':
-                            contact.customer_number = ex.value;
-                            break;
-                        case 'TAX-NUMBER':
-                            contact.tax_id = ex.value;
-                            break;
-                        case 'BANK-ACCOUNT':
-                            contact.bank_account = ex.value;
-                            break;
-                        case 'COURT':
-                            contact.local_court = ex.value;
-                            break;
-                        default:
-                            console.log(ex);
+                if (extras) {
+                    for (let ex of extras){
+                        ex = extra(ex);
+                        switch (ex.name){
+                            case 'CUSTOMER-NUMBER':
+                                contact.customer_number = ex.value;
+                                break;
+                            case 'TAX-NUMBER':
+                                contact.tax_id = ex.value;
+                                break;
+                            case 'BANK-ACCOUNT':
+                                contact.bank_account = ex.value;
+                                break;
+                            case 'COURT':
+                                contact.local_court = ex.value;
+                                break;
+                            default:
+                                console.log(ex);
+                        }
                     }
                 }
                 delete contact.vcard;

frontend/src/Components/StateSelector.svelte

@@ -3,6 +3,14 @@
     import {api}     from '../urls.svelte.js';
     import {t}       from '../translations.svelte.js';
 
+    const icons = {
+        10 : '',
+        20 : '',
+        40 : '',
+        60 : '',
+        100: ''
+    }
+
     let {
         caption    = t('select_state'),
         selected   = $bindable(0),
@@ -12,9 +20,20 @@
 </script>
 
 {#if project?.allowed_states}
-<select bind:value={selected} onchange={() => onchange(selected)}>
+<!--<select bind:value={selected} onchange={() => onchange(selected)}>
     {#each Object.entries(project.allowed_states) as [code,name]}
     <option value={+code}>{code%10?name:t('state_'+name.toLowerCase())}</option>
     {/each}
-</select>
+</select>-->
+<span class="states">
+    {#each Object.entries(project.allowed_states) as [code,name]}
+    <button onclick={e => onchange(code)} title={code%10?name:t('state_'+name.toLowerCase())} class={selected == code?'active':null}>
+        {#if icons[code]}
+        <span class="symbol">{icons[code]}</span>
+        {:else}
+        {code%10?name:t('state_'+name.toLowerCase())}
+        {/if}
+    </button>
+    {/each}
+</span>
 {/if}

frontend/src/routes/document/Add.svelte

@@ -2,7 +2,7 @@
     import { onMount }       from 'svelte';
     import { useTinyRouter } from 'svelte-tiny-router';
 
-    import { api }           from '../../urls.svelte';
+    import { api, get }           from '../../urls.svelte';
     import { error, yikes }  from '../../warn.svelte';
     import { t }             from '../../translations.svelte';
 
@@ -67,10 +67,21 @@
         if (contact.ADR.street)   addr += contact.ADR.street+"\n";
         if (contact.ADR.locality) addr += contact.ADR.post_code + " "+ contact.ADR.locality + "\n";
         if (contact.ADR.county)   addr += contact.ADR.country+"\n";
-        document.customer.name   = addr;
-        document.customer.tax_id = contact.tax_id;
-        document.customer.id     = contact.customer_number;
-        document.customer.email  = contact.EMAIL;
+        document.customer.name       = addr;
+        document.customer.tax_id     = contact.tax_id;
+        document.customer.id         = contact.customer_number;
+        document.customer.email      = contact.EMAIL;
+        document.customer.contact_id = contact.id;
+        if (!document.customer.id) requestNewCustomerId();
+    }
+
+    async function requestNewCustomerId(){
+        var url = api(`company/${document.sender.company}/next_customer_number`);
+        var res = await get(url);
+            yikes();
+            document.customer.id = await res.text();
+        if (res.ok){
+        } else error(res);
     }
 
     async function submit(){

frontend/src/routes/task/Index.svelte

@@ -6,6 +6,9 @@
     import { error, yikes }  from '../../warn.svelte';
     import { t }             from '../../translations.svelte.js';
 
+    let filter = $state(null);
+    let lower_filter = $derived(filter.toLowerCase());
+    let inverted_filter = $state(false);
     let projects = $state({});
     let router = useTinyRouter();
     let tasks = $state(null);
@@ -44,6 +47,19 @@
         router.navigate(`/task/${tid}/edit`);
     }
 
+    function filterApplies(task){
+        if (!filter) return !inverted_filter;
+        if (task.name.toLowerCase().includes(lower_filter)) return !inverted_filter;
+        if (task.description.source.toLowerCase().includes(lower_filter)) return !inverted_filter;
+        if (projects[task.project_id].name.toLowerCase().includes(lower_filter)) return !inverted_filter;
+        if (task.parent_task_id){
+            const parent = map[task.parent_task_id];
+            if (parent && parent.name.toLowerCase().includes(lower_filter)) return !inverted_filter;
+        }
+
+        return inverted_filter;
+    }
+
     function go(module, id){
         router.navigate(`/${module}/${id}/view`);
     }
@@ -103,6 +119,17 @@
 
 <fieldset>
     <legend>{loading ? t('loading_object',{object:t('task_list')}) : t('task_list')}</legend>
+    <div class="filter">
+        <label>
+            {t('filter')}: <input type="text" bind:value={filter} >
+        </label>
+        {#if filter}
+        <label>
+            <input type="checkbox" bind:checked={inverted_filter} />
+            {t('invert_filter')}
+        </label>
+        {/if}
+    </div>
     {#if tasks}
     <table>
         <thead>
@@ -117,7 +144,7 @@
         </thead>
         <tbody>
             {#each tasks as task,idx}
-            {#if task.status > 10 && task.status < 60 && !task.no_index && projects[task.project_id]?.status < 60 && !hidden[task.id]}
+            {#if task.status > 10 && task.status < 60 && !task.no_index && projects[task.project_id]?.status < 60 && !hidden[task.id] && filterApplies(task)}
             <tr>
                 <td onclick={() => go('task',task.id)}>{task.name}</td>
                 <td>
@@ -138,7 +165,7 @@
                 <td>
                     <button class="symbol" onclick={() => edit(task.id)} title={t('edit')} ></button>
                     <button class="symbol" onclick={() => postpone(idx)} title={t('postpone')} ></button>
-                    <button class="symbol" onclick={() => open(idx)} title={t('open')}></button>
+                    <button class="symbol" onclick={() => open(idx)} title={t('state_open')}></button>
                     <button class="symbol" onclick={() => start(idx)} title={t('start')} ></button>
                     <button class="symbol" onclick={() => complete(idx)} title={t('complete')} ></button>
                     <button class="symbol" onclick={() => abort(idx)} title={t('abort')} ></button>

frontend/src/routes/task/View.svelte

@@ -24,6 +24,7 @@
     let project        = $state(null);
     const router       = useTinyRouter();
     let showSettings   = $state(router.fullPath.endsWith('/edit'));
+    let show_closed    = $state(false);
     let task           = $state(null);
 
     $effect(() => updateOn(id));
@@ -79,7 +80,7 @@
         const url  = api('task/list');
         const data = {
             parent_task_id : +task.id,
-            show_closed    : task.show_closed
+            show_closed    : show_closed
         };
         const resp = await fetch(url,{
             credentials : 'include',
@@ -108,10 +109,11 @@
         const url  = api(`task/${id}`);
         const resp = await fetch(url,{credentials:'include'});
         if (resp.ok){
-            task     = await resp.json();
             yikes();
+            task     = await resp.json();
             project  = null;
             children = null;
+            if (task.show_closed) show_closed = true;
             loadChildren();
             if (task.project_id) loadProject();
             if (task.parent_task_id) loadParent();
@@ -131,6 +133,13 @@
         }
     }
 
+    function showClosed(){
+        show_closed = !show_closed;
+        children = null;
+        loadChildren();
+    }
+
+
     function showPrjFiles(){
         var url = `/files/project/${project.id}`;
         window.open(url, '_blank').focus();
@@ -292,6 +301,9 @@
     <div>
         {t('subtasks')}
         <button onclick={addChild} >{t('add_object',{object:t('subtask')})}</button>
+        {#if !show_closed}
+        <button onclick={showClosed}>{t('display_closed')}</button>
+        {/if}
     </div>
     <div class="children">
         {#if children}

frontend/src/urls.svelte.js

@@ -4,6 +4,10 @@ export function api(rel_path){
     return `${location.protocol}//${location.host.replace('5173','8080')}/api/${rel_path}`;
 }
 
+export function get(url){
+    return fetch(url,{ credentials:'include' });
+}
+
 export function drop(url){
     return fetch(url,{
         credentials:'include',

translations/src/main/resources/de.json

@@ -119,6 +119,7 @@
   "impersonate": "zu Nutzer wechseln",
   "IMPERSONATE": "Nutzer wechseln",
   "index_page": "Aufgabenübersicht",
+  "invert_filter": "Filter umkehren",
   "invoice": "Rechnung",
   "item": "Artikel",
   "items": "Artikel",

translations/src/main/resources/en.json

@@ -119,7 +119,9 @@
   "impersonate": "impersonate",
   "IMPERSONATE": "impersonate",
   "index_page": "task overview",
+  "invert_filter": "Filter umkehren",
   "invoice": "invoice",
+  "item": "Item",
   "items": "items",
 
   "join_objects" : "join {objects}",

web/src/main/resources/web/css/bloodshed-color.css

@@ -55,6 +55,15 @@ tr:hover a{
     color: black;
 }
 
+tr:hover .taglist .tag {
+    border-color: black;
+}
+
+tr:hover .taglist .tag button {
+    background: darkred;
+    color: black;
+}
+
 .archive{
   background: red;
   color: black;

web/src/main/resources/web/css/default-color.css

@@ -54,6 +54,15 @@ tr:hover a{
     color: black;
 }
 
+tr:hover .taglist .tag {
+    border-color: black;
+}
+
+tr:hover .taglist .tag button {
+    background: orange;
+    color: black;
+}
+
 .archive{
   background: black;
 }
@@ -130,6 +139,10 @@ tr:hover a{
     color: orange;
 }
 
+.states .active{
+    background: yellow;
+}
+
 .taglist .tag{
     border-color: orange;
 }

web/src/main/resources/web/css/winter-color.css

@@ -45,6 +45,19 @@ tr:hover{
     background: #afffff;
 }
 
+tr:hover a{
+    color: black;
+}
+
+tr:hover .taglist .tag {
+    border-color: black;
+}
+
+tr:hover .taglist .tag button {
+    //background: orange;
+    color: black;
+}
+
 .archive{
   background: white;
 }