From 4d3a176d989506968283b96f5a7ed385e0424b5a Mon Sep 17 00:00:00 2001
From: Rushabh Mehta <rmehta@gmail.com>
Date: Mon, 19 Feb 2018 12:01:07 +0530
Subject: [PATCH] implement templates for control

---
 client/desk/index.js          |  4 ++--
 client/view/controls/base.js  | 25 +++++++++++++++++++++----
 client/view/controls/link.js  |  8 ++++++--
 client/view/controls/table.js |  3 +--
 client/view/form.js           |  2 +-
 model/meta.js                 |  4 ++++
 6 files changed, 35 insertions(+), 11 deletions(-)

diff --git a/client/desk/index.js b/client/desk/index.js
index 864817a0..4b2b3c2e 100644
--- a/client/desk/index.js
+++ b/client/desk/index.js
@@ -106,11 +106,11 @@ module.exports = class Desk {
         return this.pages.forms[doctype];
     }
 
-    showFormModal(doctype, name) {
+    async showFormModal(doctype, name) {
         if (!this.pages.formModals[doctype]) {
             this.pages.formModals[doctype] = new FormModal(doctype);
         }
-        this.pages.formModals[doctype].showWith(doctype, name);
+        await this.pages.formModals[doctype].showWith(doctype, name);
         return this.pages.formModals[doctype];
     }
 
diff --git a/client/view/controls/base.js b/client/view/controls/base.js
index 2b0cc63e..05d21c3c 100644
--- a/client/view/controls/base.js
+++ b/client/view/controls/base.js
@@ -18,20 +18,37 @@ class BaseControl {
         if (this.setup) {
             this.setup();
         }
-        this.make();
+        if (this.template) {
+            this.wrapper = frappe.ui.add('div', 'field-template', this.parent);
+            this.renderTemplate();
+        } else {
+            this.make();
+        }
     }
 
     bind(doc) {
         this.doc = doc;
-        this.setDocValue();
+        this.refresh();
     }
 
     refresh() {
-        this.setDocValue();
+        if (this.template) {
+            this.renderTemplate();
+        } else {
+            this.setDocValue();
+        }
+    }
+
+    renderTemplate() {
+        if (this.form.doc) {
+            this.wrapper.innerHTML = this.template(this.form.doc, this.doc);
+        } else {
+            this.wrapper.innerHTML = '';
+        }
     }
 
     setDocValue() {
-        if (this.doc) {
+        if (this.doc && !this.template) {
             this.setInputValue(this.doc.get(this.fieldname));
         }
     }
diff --git a/client/view/controls/link.js b/client/view/controls/link.js
index cc54e73f..3bfb793c 100644
--- a/client/view/controls/link.js
+++ b/client/view/controls/link.js
@@ -34,10 +34,14 @@ class LinkControl extends BaseControl {
             if (e.text && e.text.value === '__newItem') {
                 e.preventDefault();
                 const newDoc = await frappe.getNewDoc(this.target);
-                const formModal = frappe.desk.showFormModal(this.target, newDoc.name);
+                const formModal = await frappe.desk.showFormModal(this.target, newDoc.name);
+                if (formModal.form.doc.meta.hasField('name')) {
+                    formModal.form.doc.set('name', this.input.value);
+                }
+
                 formModal.once('submit', async () => {
                     await this.updateDocValue(formModal.form.doc.name);
-                })
+                });
             }
         });
 
diff --git a/client/view/controls/table.js b/client/view/controls/table.js
index e61684fc..c0f1c166 100644
--- a/client/view/controls/table.js
+++ b/client/view/controls/table.js
@@ -27,7 +27,7 @@ class TableControl extends BaseControl {
         this.datatable = new DataTable(this.wrapper.querySelector('.datatable-wrapper'), {
             columns: this.getColumns(),
             data: this.getTableData(),
-            takeAvailableSpace: true,
+            layout: 'fluid',
             addCheckboxColumn: true,
             getEditor: this.getTableInput.bind(this),
         });
@@ -127,7 +127,6 @@ class TableControl extends BaseControl {
                 id: field.fieldname,
                 field: field,
                 content: field.label,
-                width: 120,
                 editable: (this.disabled || field.disabled) ? false : true,
                 sortable: false,
                 resizable: true,
diff --git a/client/view/form.js b/client/view/form.js
index 657d0eb4..ea06f0d6 100644
--- a/client/view/form.js
+++ b/client/view/form.js
@@ -132,7 +132,7 @@ module.exports = class BaseForm extends Observable {
                 // only single value changed
                 let control = this.controls[params.fieldname];
                 if (control && control.getInputValue() !== control.format(params.fieldname)) {
-                    control.setDocValue();
+                    control.refresh();
                 }
             } else {
                 // multiple values changed
diff --git a/model/meta.js b/model/meta.js
index a77dd93d..b199facc 100644
--- a/model/meta.js
+++ b/model/meta.js
@@ -13,6 +13,10 @@ module.exports = class BaseMeta extends BaseDocument {
         }
     }
 
+    hasField(fieldname) {
+        return this.getField(fieldname) ? true : false;
+    }
+
     getField(fieldname) {
         if (!this._field_map) {
             this._field_map = {};