From 2e3a3016dbfff54d813d9a71c1949d11335b1aff Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Sat, 3 May 2025 15:35:10 +0530
Subject: [PATCH] fix: handle onchange of grid row field in modal

(cherry picked from commit 2d484c1ad2a7c70af1bb593bad1b9ee0a7bef54f)
---
 frontend/src/components/Controls/Grid.vue     |  7 +-----
 .../src/components/Controls/GridRowModal.vue  |  8 +++++-
 frontend/src/components/FieldLayout/Field.vue | 19 +++++++++++---
 .../components/FieldLayout/FieldLayout.vue    |  5 ++++
 frontend/src/data/document.js                 | 25 +++++++++----------
 5 files changed, 40 insertions(+), 24 deletions(-)

diff --git a/frontend/src/components/Controls/Grid.vue b/frontend/src/components/Controls/Grid.vue
index 7f879bd2..c5b79e9c 100644
--- a/frontend/src/components/Controls/Grid.vue
+++ b/frontend/src/components/Controls/Grid.vue
@@ -327,7 +327,6 @@ const props = defineProps({
 })
 
 const triggerOnChange = inject('triggerOnChange')
-const fieldname = inject('fieldname')
 
 const {
   getGridViewSettings,
@@ -426,11 +425,7 @@ const deleteRows = () => {
 
 function fieldChange(value, field, row) {
   row[field.fieldname] = value
-  triggerOnChange(field.fieldname, {
-    fieldname: fieldname,
-    dt: props.doctype,
-    dn: row.name,
-  })
+  triggerOnChange(field.fieldname, row)
 }
 </script>
 
diff --git a/frontend/src/components/Controls/GridRowModal.vue b/frontend/src/components/Controls/GridRowModal.vue
index 74e17db6..ef2bc854 100644
--- a/frontend/src/components/Controls/GridRowModal.vue
+++ b/frontend/src/components/Controls/GridRowModal.vue
@@ -23,7 +23,13 @@
           </div>
         </div>
         <div>
-          <FieldLayout v-if="tabs.data" :tabs="tabs.data" :data="data" />
+          <FieldLayout
+            v-if="tabs.data"
+            :tabs="tabs.data"
+            :data="data"
+            :doctype="doctype"
+            :isGridRow="true"
+          />
         </div>
       </div>
     </template>
diff --git a/frontend/src/components/FieldLayout/Field.vue b/frontend/src/components/FieldLayout/Field.vue
index 044d3494..5e52c3ba 100644
--- a/frontend/src/components/FieldLayout/Field.vue
+++ b/frontend/src/components/FieldLayout/Field.vue
@@ -213,16 +213,23 @@ const props = defineProps({
 const data = inject('data')
 const doctype = inject('doctype')
 const preview = inject('preview')
+const isGridRow = inject('isGridRow')
 
 const { getFormattedPercent, getFormattedFloat, getFormattedCurrency } =
   getMeta(doctype)
 
 const { getUser } = usersStore()
 
-const { triggerOnChange } = useDocument(doctype, data.value.name)
+let triggerOnChange
 
-provide('triggerOnChange', triggerOnChange)
-provide('fieldname', props.field.fieldname)
+if (!isGridRow) {
+  const { triggerOnChange: trigger } = useDocument(doctype, data.value.name)
+  triggerOnChange = trigger
+
+  provide('triggerOnChange', triggerOnChange)
+} else {
+  triggerOnChange = inject('triggerOnChange')
+}
 
 const field = computed(() => {
   let field = props.field
@@ -283,7 +290,11 @@ const getPlaceholder = (field) => {
 function fieldChange(value, df) {
   data.value[df.fieldname] = value
 
-  triggerOnChange(df.fieldname)
+  if (isGridRow) {
+    triggerOnChange(df.fieldname, data.value)
+  } else {
+    triggerOnChange(df.fieldname)
+  }
 }
 </script>
 <style scoped>
diff --git a/frontend/src/components/FieldLayout/FieldLayout.vue b/frontend/src/components/FieldLayout/FieldLayout.vue
index 45c588d9..1e5955e0 100644
--- a/frontend/src/components/FieldLayout/FieldLayout.vue
+++ b/frontend/src/components/FieldLayout/FieldLayout.vue
@@ -34,6 +34,10 @@ const props = defineProps({
     type: String,
     default: 'CRM Lead',
   },
+  isGridRow: {
+    type: Boolean,
+    default: false,
+  },
   preview: {
     type: Boolean,
     default: false,
@@ -55,6 +59,7 @@ provide(
 provide('hasTabs', hasTabs)
 provide('doctype', props.doctype)
 provide('preview', props.preview)
+provide('isGridRow', props.isGridRow)
 </script>
 <style scoped>
 .section:not(:has(.field)) {
diff --git a/frontend/src/data/document.js b/frontend/src/data/document.js
index 81a397b8..83875544 100644
--- a/frontend/src/data/document.js
+++ b/frontend/src/data/document.js
@@ -41,38 +41,37 @@ export function useDocument(doctype, docname) {
     documentsCache[doctype][docname]['controllers'] = controllers
   }
 
-  async function triggerOnChange(fieldname, childTableObj) {
+  async function triggerOnChange(fieldname, row) {
     let controllers = documentsCache[doctype][docname]?.controllers
     if (Object.keys(controllers).length === 0) return
 
-    let _dt = childTableObj.dt ? childTableObj.dt : doctype
+    let _dt = row?.doctype ? row.doctype : doctype
     let doctypeClassName = _dt.replace(/\s+/g, '')
     const c = controllers[doctypeClassName]
     if (!c) return
 
-    if (childTableObj) {
-      let grid = documentsCache[doctype][docname].doc[childTableObj.fieldname]
-      c.row = grid.find((row) => row.name === childTableObj.dn)
-      c.oldValue = getOldValue(fieldname, childTableObj)
-      c.value = c.row[fieldname]
+    if (row) {
+      c.row = () => row
+      c.value = row[fieldname]
+      c.oldValue = getOldValue(fieldname, row)
     } else {
-      c.oldValue = getOldValue(fieldname)
       c.value = documentsCache[doctype][docname].doc[fieldname]
+      c.oldValue = getOldValue(fieldname)
     }
 
     return await c[fieldname]?.()
   }
 
-  function getOldValue(fieldname, childTableObj) {
+  function getOldValue(fieldname, row) {
     if (!documentsCache[doctype][docname]) return ''
 
     const document = documentsCache[doctype][docname]
     const oldDoc = document.originalDoc
 
-    if (childTableObj?.dn) {
-      return oldDoc?.[childTableObj.fieldname]?.find(
-        (r) => r.name === childTableObj.dn,
-      )?.[fieldname]
+    if (row?.name) {
+      return oldDoc?.[row.parentfield]?.find((r) => r.name === row.name)?.[
+        fieldname
+      ]
     }
 
     return oldDoc?.[fieldname] || document.doc[fieldname]