feat: forward change event from setting tabs

src/pages/Settings/TabGeneral.vue

@@ -1,6 +1,13 @@
 <template>
   <div>
-    <TwoColumnForm v-if="doc" :doc="doc" :fields="fields" :autosave="true" />
+    <TwoColumnForm
+      v-if="doc"
+      :doc="doc"
+      :fields="fields"
+      :autosave="true"
+      :emit-change="true"
+      @change="forwardChangeEvent"
+    />
   </div>
 </template>
 
@@ -11,16 +18,16 @@ import TwoColumnForm from '@/components/TwoColumnForm';
 export default {
   name: 'TabGeneral',
   components: {
-    TwoColumnForm
+    TwoColumnForm,
   },
   data() {
     return {
-      doc: null
+      doc: null,
     };
   },
   async mounted() {
     this.doc = await frappe.getDoc('AccountingSettings', 'AccountingSettings', {
-      skipDocumentCache: true
+      skipDocumentCache: true,
     });
   },
   computed: {
@@ -36,8 +43,13 @@ export default {
         'fiscalYearStart',
         'fiscalYearEnd',
         'gstin',
-      ].map(fieldname => meta.getField(fieldname));
-    }
-  }
+      ].map((fieldname) => meta.getField(fieldname));
+    },
+  },
+  methods: {
+    forwardChangeEvent(...args) {
+      this.$emit('change', ...args);
+    },
+  },
 };
 </script>

src/pages/Settings/TabInvoice.vue

@@ -8,6 +8,7 @@
           (value) => {
             doc.set('logo', value);
             doc.update();
+            forwardChangeEvent(meta.getField('logo'));
           }
         "
       />
@@ -27,13 +28,21 @@
             (value) => {
               doc.set('displayLogo', value);
               doc.update();
+              forwardChangeEvent(meta.getField('displayLogo'));
             }
           "
           size="small"
         />
       </div>
     </div>
-    <TwoColumnForm class="mt-6" :doc="doc" :fields="fields" :autosave="true" />
+    <TwoColumnForm
+      class="mt-6"
+      :doc="doc"
+      :fields="fields"
+      :autosave="true"
+      :emit-change="true"
+      @change="forwardChangeEvent"
+    />
   </div>
 </template>
 <script>
@@ -73,14 +82,9 @@ export default {
       return frappe.getMeta('PrintSettings');
     },
     fields() {
-      return [
-        'template',
-        'color',
-        'font',
-        'email',
-        'phone',
-        'address',
-      ].map((field) => this.meta.getField(field));
+      return ['template', 'color', 'font', 'email', 'phone', 'address'].map(
+        (field) => this.meta.getField(field)
+      );
     },
   },
   methods: {
@@ -90,12 +94,18 @@ export default {
         properties: ['openFile'],
         filters: [{ name: 'Invoice Logo', extensions: ['png', 'jpg', 'svg'] }],
       };
-      const { filePaths } = await ipcRenderer.invoke(IPC_ACTIONS.GET_OPEN_FILEPATH, options);
+      const { filePaths } = await ipcRenderer.invoke(
+        IPC_ACTIONS.GET_OPEN_FILEPATH,
+        options
+      );
       if (filePaths[0] !== undefined) {
         this.doc.set('logo', `file://${files[0]}`);
         this.doc.update;
       }
     },
+    forwardChangeEvent(...args) {
+      this.$emit('change', ...args);
+    },
   },
 };
 </script>

src/pages/Settings/TabSystem.vue

@@ -1,6 +1,13 @@
 <template>
   <div>
-    <TwoColumnForm v-if="doc" :doc="doc" :fields="fields" :autosave="true" />
+    <TwoColumnForm
+      v-if="doc"
+      :doc="doc"
+      :fields="fields"
+      :autosave="true"
+      :emit-change="true"
+      @change="forwardChangeEvent"
+    />
   </div>
 </template>
 
@@ -28,5 +35,10 @@ export default {
       return meta.getQuickEditFields();
     },
   },
+  methods: {
+    forwardChangeEvent(...args) {
+      this.$emit('change', ...args);
+    },
+  },
 };
 </script>