u

src/components/settings/CompanySettingsPanel.jsx

@@ -52,11 +52,17 @@ export default class CompanySettingsPanel extends Component {
 
   syncFormFromCompany(companyRow) {
     if (!companyRow) return;
-    this.setState({
+    this._initial = {
       name: companyRow.name ?? '',
       iso639: companyRow.iso639 ?? 'de',
       taxrate: companyRow.taxrate != null ? String(companyRow.taxrate) : '',
       reducedtaxrate: companyRow.reducedtaxrate != null ? String(companyRow.reducedtaxrate) : '',
+    };
+    this.setState({
+      name: this._initial.name,
+      iso639: this._initial.iso639,
+      taxrate: this._initial.taxrate,
+      reducedtaxrate: this._initial.reducedtaxrate,
       status: 'ready',
     });
   }
@@ -100,6 +106,12 @@ export default class CompanySettingsPanel extends Component {
         taxrate: parsedTaxrate,
         reducedtaxrate: parsedReducedtaxrate,
       });
+      this._initial = {
+        name: name.trim(),
+        iso639,
+        taxrate: String(parsedTaxrate),
+        reducedtaxrate: String(parsedReducedtaxrate),
+      };
       enqueueSnackbar('Unternehmen gespeichert.', { variant: 'success' });
     } catch (err) {
       this.setState({ error: backendErrorFrom(err) });
@@ -125,7 +137,14 @@ export default class CompanySettingsPanel extends Component {
 
     const parsedTaxrate = parseTaxRate(taxrate);
     const parsedReducedtaxrate = parseTaxRate(reducedtaxrate);
+    const isDirty =
+      Boolean(this._initial) &&
+      (name.trim() !== this._initial.name.trim() ||
+        iso639 !== this._initial.iso639 ||
+        taxrate.trim() !== this._initial.taxrate.trim() ||
+        reducedtaxrate.trim() !== this._initial.reducedtaxrate.trim());
     const canSave =
+      isDirty &&
       name.trim() !== '' &&
       ISO639_OPTIONS.includes(iso639) &&
       parsedTaxrate != null &&
@@ -218,8 +237,14 @@ export default class CompanySettingsPanel extends Component {
             <Button
               type="submit"
               variant="contained"
+              color={canSave ? 'success' : 'inherit'}
               disabled={busy || !canSave}
               startIcon={busy ? <CircularProgress size={16} color="inherit" /> : null}
+              sx={
+                canSave
+                  ? { bgcolor: 'success.main', color: '#fff', '&:hover': { bgcolor: 'success.dark' } }
+                  : undefined
+              }
             >
               Speichern
             </Button>