fix: Patient History (Patient Medical Record) (#17972)

* Page - Patient History

* Healthcare Utils - get patient vitals

* Healthcare Utils - render doc as html for patient history page

* Page - Patient History -  prcatitioner image in time line

* Page - Patient History in menu

* fix - page medical history

* fix: page patient_history broken img, minor fixes

* fix: patient_history page, add pagination, show doc if fetched

* fix: Patient Medical Record to Patient History

* fix: patient history page - set route options

* fix: update to code standards

* fix: remove Eidt button form patient history

* fix: css update to code standards

* fix: Remove page medical_record
diff --git a/erpnext/healthcare/doctype/patient/patient.js b/erpnext/healthcare/doctype/patient/patient.js
index 1692814..1a34fe8 100644
--- a/erpnext/healthcare/doctype/patient/patient.js
+++ b/erpnext/healthcare/doctype/patient/patient.js
@@ -21,9 +21,9 @@
 			});
 		}
 		if (frm.doc.patient_name && frappe.user.has_role("Physician")) {
-			frm.add_custom_button(__('Medical Record'), function () {
+			frm.add_custom_button(__('Patient History'), function () {
 				frappe.route_options = { "patient": frm.doc.name };
-				frappe.set_route("medical_record");
+				frappe.set_route("patient_history");
 			},"View");
 		}
 		if (!frm.doc.__islocal && (frappe.user.has_role("Nursing User") || frappe.user.has_role("Physician"))) {
diff --git a/erpnext/healthcare/doctype/patient_appointment/patient_appointment.js b/erpnext/healthcare/doctype/patient_appointment/patient_appointment.js
index b3cbd1f..858145e 100644
--- a/erpnext/healthcare/doctype/patient_appointment/patient_appointment.js
+++ b/erpnext/healthcare/doctype/patient_appointment/patient_appointment.js
@@ -30,9 +30,9 @@
 			};
 		});
 		if(frm.doc.patient){
-			frm.add_custom_button(__('Medical Record'), function() {
+			frm.add_custom_button(__('Patient History'), function() {
 				frappe.route_options = {"patient": frm.doc.patient};
-				frappe.set_route("medical_record");
+				frappe.set_route("patient_history");
 			},__("View"));
 		}
 		if(frm.doc.status == "Open"){
diff --git a/erpnext/healthcare/doctype/patient_encounter/patient_encounter.js b/erpnext/healthcare/doctype/patient_encounter/patient_encounter.js
index 7ea4568..088bc81 100644
--- a/erpnext/healthcare/doctype/patient_encounter/patient_encounter.js
+++ b/erpnext/healthcare/doctype/patient_encounter/patient_encounter.js
@@ -41,10 +41,10 @@
 				}
 			});
 		}
-		frm.add_custom_button(__('Medical Record'), function() {
+		frm.add_custom_button(__('Patient History'), function() {
 			if (frm.doc.patient) {
 				frappe.route_options = {"patient": frm.doc.patient};
-				frappe.set_route("medical_record");
+				frappe.set_route("patient_history");
 			} else {
 				frappe.msgprint(__("Please select Patient"));
 			}
diff --git a/erpnext/healthcare/page/medical_record/__init__.py b/erpnext/healthcare/page/medical_record/__init__.py
deleted file mode 100644
index baffc48..0000000
--- a/erpnext/healthcare/page/medical_record/__init__.py
+++ /dev/null
@@ -1 +0,0 @@
-from __future__ import unicode_literals
diff --git a/erpnext/healthcare/page/medical_record/medical_record.js b/erpnext/healthcare/page/medical_record/medical_record.js
deleted file mode 100644
index df19d8f..0000000
--- a/erpnext/healthcare/page/medical_record/medical_record.js
+++ /dev/null
@@ -1,182 +0,0 @@
-frappe.provide("frappe.medical_record");
-frappe.pages['medical_record'].on_page_load = function(wrapper) {
-	var me = this;
-	var page = frappe.ui.make_app_page({
-		parent: wrapper,
-		title: 'Medical Record',
-	});
-
-	frappe.breadcrumbs.add("Medical");
-
-	page.main.html(frappe.render_template("patient_select", {}));
-	var patient = frappe.ui.form.make_control({
-		parent: page.main.find(".patient"),
-		df: {
-			fieldtype: "Link",
-			options: "Patient",
-			fieldname: "patient",
-			change: function(){
-				page.main.find(".frappe-list").html("");
-				draw_page(patient.get_value(), me);
-			}
-		},
-		only_input: true,
-	});
-	patient.refresh();
-
-
-	this.page.main.on("click", ".medical_record-message", function() {
-		var	doctype = $(this).attr("data-doctype"),
-			docname = $(this).attr("data-docname");
-
-		if (doctype && docname) {
-			frappe.route_options = {
-				scroll_to: { "doctype": doctype, "name": docname }
-			};
-			frappe.set_route(["Form", doctype, docname]);
-		}
-	});
-
-	this.page.sidebar.on("click", ".edit-details", function() {
-		patient = patient.get_value();
-		if (patient) {
-			frappe.set_route(["Form", "Patient", patient]);
-		}
-	});
-
-};
-
-frappe.pages['medical_record'].refresh = function() {
-	var me = this;
-
-	if(frappe.route_options) {
-		if(frappe.route_options.patient){
-			me.page.main.find(".frappe-list").html("");
-			var patient = frappe.route_options.patient;
-			draw_page(patient,me);
-			me.page.main.find("[data-fieldname='patient']").val(patient);
-			frappe.route_options = null;
-		}
-	}
-};
-var show_patient_info = function(patient, me){
-	frappe.call({
-		"method": "erpnext.healthcare.doctype.patient.patient.get_patient_detail",
-		args: {
-			patient: patient
-		},
-		callback: function (r) {
-			var data = r.message;
-			var details = "";
-			if(data.email) details += "<br><b>Email :</b> " + data.email;
-			if(data.mobile) details += "<br><b>Mobile :</b> " + data.mobile;
-			if(data.occupation) details += "<br><b>Occupation :</b> " + data.occupation;
-			if(data.blood_group) details += "<br><b>Blood group : </b> " + data.blood_group;
-			if(data.allergies) details +=  "<br><br><b>Allergies : </b> "+  data.allergies;
-			if(data.medication) details +=  "<br><b>Medication : </b> "+  data.medication;
-			if(data.alcohol_current_use) details +=  "<br><br><b>Alcohol use : </b> "+  data.alcohol_current_use;
-			if(data.alcohol_past_use) details +=  "<br><b>Alcohol past use : </b> "+  data.alcohol_past_use;
-			if(data.tobacco_current_use) details +=  "<br><b>Tobacco use : </b> "+  data.tobacco_current_use;
-			if(data.tobacco_past_use) details +=  "<br><b>Tobacco past use : </b> "+  data.tobacco_past_use;
-			if(data.medical_history) details +=  "<br><br><b>Medical history : </b> "+  data.medical_history;
-			if(data.surgical_history) details +=  "<br><b>Surgical history : </b> "+  data.surgical_history;
-			if(data.surrounding_factors) details +=  "<br><br><b>Occupational hazards : </b> "+  data.surrounding_factors;
-			if(data.other_risk_factors) details += "<br><b>Other risk factors : </b> " + data.other_risk_factors;
-			if(data.patient_details) details += "<br><br><b>More info : </b> " + data.patient_details;
-
-			if(details){
-				details = "<div style='padding-left:10px; font-size:13px;' align='center'></br><b class='text-muted'>Patient Details</b>" + details + "</div>";
-			}
-
-			var vitals = "";
-			if(data.temperature) vitals += "<br><b>Temperature :</b> " + data.temperature;
-			if(data.pulse) vitals += "<br><b>Pulse :</b> " + data.pulse;
-			if(data.respiratory_rate) vitals += "<br><b>Respiratory Rate :</b> " + data.respiratory_rate;
-			if(data.bp) vitals += "<br><b>BP :</b> " + data.bp;
-			if(data.bmi) vitals += "<br><b>BMI :</b> " + data.bmi;
-			if(data.height) vitals += "<br><b>Height :</b> " + data.height;
-			if(data.weight) vitals += "<br><b>Weight :</b> " + data.weight;
-			if(data.signs_date) vitals += "<br><b>Date :</b> " + data.signs_date;
-
-			if(vitals){
-				vitals = "<div style='padding-left:10px; font-size:13px;' align='center'></br><b class='text-muted'>Vital Signs</b>" + vitals + "<br></div>";
-				details = vitals + details;
-			}
-			if(details) details += "<div align='center'><br><a class='btn btn-default btn-sm edit-details'>Edit Details</a></b> </div>";
-
-			me.page.sidebar.addClass("col-sm-3");
-			me.page.sidebar.html(details);
-			me.page.wrapper.find(".layout-main-section-wrapper").addClass("col-sm-9");
-		}
-	});
-};
-var draw_page = function(patient, me){
-	frappe.model.with_doctype("Patient Medical Record", function() {
-		me.page.list = new frappe.ui.BaseList({
-			hide_refresh: true,
-			page: me.page,
-			method: 'erpnext.healthcare.page.medical_record.medical_record.get_feed',
-			args: {name: patient},
-			parent: $("<div></div>").appendTo(me.page.main),
-			render_view: function(values) {
-				var me = this;
-				var wrapper = me.page.main.find(".result-list").get(0);
-				values.map(function (value) {
-					var row = $('<div class="list-row">').data("data", value).appendTo($(wrapper)).get(0);
-					new frappe.medical_record.Feed(row, value);
-				});
-			},
-			show_filters: true,
-			doctype: "Patient Medical Record",
-		});
-		show_patient_info(patient, me);
-		me.page.list.run();
-	});
-};
-
-frappe.medical_record.last_feed_date = false;
-frappe.medical_record.Feed = Class.extend({
-	init: function(row, data) {
-		this.scrub_data(data);
-		this.add_date_separator(row, data);
-		if(!data.add_class)
-			data.add_class = "label-default";
-
-		data.link = "";
-		if (data.reference_doctype && data.reference_name) {
-			data.link = frappe.format(data.reference_name, {fieldtype: "Link", options: data.reference_doctype},
-				{label: __(data.reference_doctype)});
-		}
-
-		$(row)
-			.append(frappe.render_template("medical_record_row", data))
-			.find("a").addClass("grey");
-	},
-	scrub_data: function(data) {
-		data.by = frappe.user.full_name(data.owner);
-		data.imgsrc = frappe.utils.get_file_link(frappe.user_info(data.owner).image);
-
-		data.icon = "icon-flag";
-	},
-	add_date_separator: function(row, data) {
-		var date = frappe.datetime.str_to_obj(data.creation);
-		var last = frappe.medical_record.last_feed_date;
-
-		if((last && frappe.datetime.obj_to_str(last) != frappe.datetime.obj_to_str(date)) || (!last)) {
-			var diff = frappe.datetime.get_day_diff(frappe.datetime.get_today(), frappe.datetime.obj_to_str(date));
-			if(diff < 1) {
-				var pdate = 'Today';
-			} else if(diff < 2) {
-				pdate = 'Yesterday';
-			} else {
-				pdate = frappe.datetime.global_date_format(date);
-			}
-			data.date_sep = pdate;
-			data.date_class = pdate=='Today' ? "date-indicator blue" : "date-indicator";
-		} else {
-			data.date_sep = null;
-			data.date_class = "";
-		}
-		frappe.medical_record.last_feed_date = date;
-	}
-});
diff --git a/erpnext/healthcare/page/medical_record/medical_record.json b/erpnext/healthcare/page/medical_record/medical_record.json
deleted file mode 100644
index ca30c3b..0000000
--- a/erpnext/healthcare/page/medical_record/medical_record.json
+++ /dev/null
@@ -1,25 +0,0 @@
-{
- "content": null, 
- "creation": "2016-06-09 11:33:14.025787", 
- "docstatus": 0, 
- "doctype": "Page", 
- "icon": "icon-play", 
- "idx": 0, 
- "modified": "2018-08-06 11:40:39.705660", 
- "modified_by": "Administrator", 
- "module": "Healthcare", 
- "name": "medical_record", 
- "owner": "Administrator", 
- "page_name": "medical_record", 
- "restrict_to_domain": "Healthcare", 
- "roles": [
-  {
-   "role": "Physician"
-  }
- ], 
- "script": null, 
- "standard": "Yes", 
- "style": null, 
- "system_page": 0, 
- "title": "Medical Record"
-}
\ No newline at end of file
diff --git a/erpnext/healthcare/page/medical_record/medical_record.py b/erpnext/healthcare/page/medical_record/medical_record.py
deleted file mode 100644
index 22c5852..0000000
--- a/erpnext/healthcare/page/medical_record/medical_record.py
+++ /dev/null
@@ -1,24 +0,0 @@
-# -*- coding: utf-8 -*-
-# Copyright (c) 2015, ESS LLP and contributors
-# For license information, please see license.txt
-
-from __future__ import unicode_literals
-import frappe
-from frappe.utils import cint
-
-@frappe.whitelist()
-def get_feed(start, page_length, name):
-	"""get feed"""
-	result = frappe.db.sql("""select name, owner, modified, creation,
-			reference_doctype, reference_name, subject
-		from `tabPatient Medical Record`
-		where patient=%(patient)s
-		order by creation desc
-		limit %(start)s, %(page_length)s""",
-		{
-			"start": cint(start),
-			"page_length": cint(page_length),
-			"patient": name
-		}, as_dict=True)
-
-	return result
diff --git a/erpnext/healthcare/page/medical_record/medical_record_row.html b/erpnext/healthcare/page/medical_record/medical_record_row.html
deleted file mode 100644
index 9a670c9..0000000
--- a/erpnext/healthcare/page/medical_record/medical_record_row.html
+++ /dev/null
@@ -1,21 +0,0 @@
-<div class="row medical_record-row" data-creation="{%= creation.split(" ")[0] + " 00:00:00" %}">
-	<div class="col-xs-3 text-right medical_record-date"><span class="{%= date_class %}">
-		{%= date_sep || "" %}</span>
-	</div>
-	<div class="col-xs-9 medical_record-message"
-		data-doctype="{%= reference_doctype %}"
-		data-docname="{%= reference_name %}"
-		title="{%= by %} / {%= frappe.datetime.str_to_user(creation) %}">
-		<span class="avatar avatar-small">
-			<div class="avatar-frame" style="background-image: url({{ imgsrc }});"></div>
-			<!-- <img src="{%= imgsrc %}"> -->
-		</span>
-		<span class="small">
-		{% if (reference_doctype && reference_name) { %}
-			{%= __("{0}: {1}", [link, "<strong>" + subject + "</strong>"]) %}
-		{% } else { %}
-			{%= subject %}
-		{% } %}
-	</span>
-	</div>
-</div>
diff --git a/erpnext/healthcare/page/medical_record/patient_select.html b/erpnext/healthcare/page/medical_record/patient_select.html
deleted file mode 100644
index 321baf7..0000000
--- a/erpnext/healthcare/page/medical_record/patient_select.html
+++ /dev/null
@@ -1,5 +0,0 @@
-<div class="text-center col-sm-9" style="padding: 40px;">
-
-    	<p>{%= __("Select Patient") %}</p>
-	<p class="patient" style="margin: auto; max-width: 300px; margin-bottom: 20px;"></p>
-</div>
diff --git a/erpnext/healthcare/page/patient_history/__init__.py b/erpnext/healthcare/page/patient_history/__init__.py
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/erpnext/healthcare/page/patient_history/__init__.py
diff --git a/erpnext/healthcare/page/medical_record/medical_record.css b/erpnext/healthcare/page/patient_history/patient_history.css
similarity index 62%
rename from erpnext/healthcare/page/medical_record/medical_record.css
rename to erpnext/healthcare/page/patient_history/patient_history.css
index 977625b..865d6ab 100644
--- a/erpnext/healthcare/page/medical_record/medical_record.css
+++ b/erpnext/healthcare/page/patient_history/patient_history.css
@@ -14,6 +14,10 @@
 	margin-bottom: -4px;
 }
 
+.medical_record-row > * {
+	z-index: -999;
+}
+
 .date-indicator {
     background:none;
     font-size:12px;
@@ -35,6 +39,61 @@
 	color: #5e64ff;
 }
 
+.div-bg-color {
+	background: #fafbfc;
+}
+
+.bg-color-white {
+	background: #FFFFFF;
+}
+
+.d-flex {
+	display: flex;
+}
+
+.width-full {
+	width: 100%;
+}
+
+.p-3 {
+	padding: 16px;
+}
+
+.mt-2 {
+	margin-top: 8px;
+}
+
+.mr-3 {
+	margin-right: 16px;
+}
+
+.Box {
+	background-color: #fff;
+	border: 1px solid #d1d5da;
+	border-radius: 3px;
+}
+
+.flex-column {
+	flex-direction: column;
+}
+
+.avatar {
+	display: inline-block;
+	overflow: hidden;
+	line-height: 1;
+	vertical-align: middle;
+	border-radius: 3px;
+}
+
+.py-3 {
+	padding-top: 16px;
+	padding-bottom: 16px;
+}
+
+.border-bottom {
+	border-bottom: 1px #e1e4e8 solid;
+}
+
 .date-indicator.blue::after {
 	background: #5e64ff;
 }
@@ -65,8 +124,3 @@
 #page-medical_record .list-filters {
 	display: none ;
 }
-
-#page-medical_record .octicon-heart {
-	color: #ff5858;
-	margin: 0px 5px;
-}
diff --git a/erpnext/healthcare/page/patient_history/patient_history.html b/erpnext/healthcare/page/patient_history/patient_history.html
new file mode 100644
index 0000000..7a9446d
--- /dev/null
+++ b/erpnext/healthcare/page/patient_history/patient_history.html
@@ -0,0 +1,20 @@
+<div class="col-sm-12">
+	<div class="col-sm-3">
+	<p class="text-center">{%= __("Select Patient") %}</p>
+	<p class="patient" style="margin: auto; max-width: 300px; margin-bottom: 20px;"></p>
+	<div class="patient_details" style="z-index=0"></div>
+	</div>
+	<div class="col-sm-9 patient_documents">
+		<div class="col-sm-12">
+			<div class="col-sm-12 show_chart_btns" align="center">
+			</div>
+			<div id="chart" class="col-sm-12 patient_vital_charts">
+			</div>
+		</div>
+		<div class="col-sm-12 patient_documents_list">
+		</div>
+		<div class="col-sm-12 text-center py-3">
+			<a class="btn btn-sm btn-default btn-get-records" style="display:none">More..</a>
+		</div>
+	</div>
+</div>
\ No newline at end of file
diff --git a/erpnext/healthcare/page/patient_history/patient_history.js b/erpnext/healthcare/page/patient_history/patient_history.js
new file mode 100644
index 0000000..87fe7ed
--- /dev/null
+++ b/erpnext/healthcare/page/patient_history/patient_history.js
@@ -0,0 +1,300 @@
+frappe.provide("frappe.patient_history");
+frappe.pages['patient_history'].on_page_load = function(wrapper) {
+	var me = this;
+	var page = frappe.ui.make_app_page({
+		parent: wrapper,
+		title: 'Patient History',
+		single_column: true
+	});
+
+	frappe.breadcrumbs.add("Healthcare");
+	let pid = '';
+	page.main.html(frappe.render_template("patient_history", {}));
+	var patient = frappe.ui.form.make_control({
+		parent: page.main.find(".patient"),
+		df: {
+			fieldtype: "Link",
+			options: "Patient",
+			fieldname: "patient",
+			change: function(){
+				if(pid != patient.get_value() && patient.get_value()){
+					me.start = 0;
+					me.page.main.find(".patient_documents_list").html("");
+					get_documents(patient.get_value(), me);
+					show_patient_info(patient.get_value(), me);
+					show_patient_vital_charts(patient.get_value(), me, "bp", "mmHg", "Blood Pressure");
+				}
+				pid = patient.get_value();
+			}
+		},
+		only_input: true,
+	});
+	patient.refresh();
+
+	if (frappe.route_options){
+		patient.set_value(frappe.route_options.patient);
+	}
+
+	this.page.main.on("click", ".btn-show-chart", function() {
+		var	btn_show_id = $(this).attr("data-show-chart-id"), pts = $(this).attr("data-pts");
+		var title = $(this).attr("data-title");
+		show_patient_vital_charts(patient.get_value(), me, btn_show_id, pts, title);
+	});
+
+	this.page.main.on("click", ".btn-more", function() {
+		var	doctype = $(this).attr("data-doctype"), docname = $(this).attr("data-docname");
+		if(me.page.main.find("."+docname).parent().find('.document-html').attr('data-fetched') == "1"){
+			me.page.main.find("."+docname).hide();
+			me.page.main.find("."+docname).parent().find('.document-html').show();
+		}else{
+			if(doctype && docname){
+				let exclude = ["patient", "patient_name", 'patient_sex', "encounter_date"];
+				frappe.call({
+					method: "erpnext.healthcare.utils.render_doc_as_html",
+					args:{
+						doctype: doctype,
+						docname: docname,
+						exclude_fields: exclude
+					},
+					callback: function(r) {
+						if (r.message){
+							me.page.main.find("."+docname).hide();
+							me.page.main.find("."+docname).parent().find('.document-html').html(r.message.html+"\
+							<div align='center'><a class='btn octicon octicon-chevron-up btn-default btn-xs\
+							btn-less' data-doctype='"+doctype+"' data-docname='"+docname+"'></a></div>");
+							me.page.main.find("."+docname).parent().find('.document-html').show();
+							me.page.main.find("."+docname).parent().find('.document-html').attr('data-fetched', "1");
+						}
+					},
+					freeze: true
+				});
+			}
+		}
+	});
+
+	this.page.main.on("click", ".btn-less", function() {
+		var docname = $(this).attr("data-docname");
+		me.page.main.find("."+docname).parent().find('.document-id').show();
+		me.page.main.find("."+docname).parent().find('.document-html').hide();
+	});
+	me.start = 0;
+	me.page.main.on("click", ".btn-get-records", function(){
+		get_documents(patient.get_value(), me);
+	});
+};
+
+var get_documents = function(patient, me){
+	frappe.call({
+		"method": "erpnext.healthcare.page.patient_history.patient_history.get_feed",
+		args: {
+			name: patient,
+			start: me.start,
+			page_length: 20
+		},
+		callback: function (r) {
+			var data = r.message;
+			if(data.length){
+				add_to_records(me, data);
+			}else{
+				me.page.main.find(".patient_documents_list").append("<div class='text-muted' align='center'><br><br>No more records..<br><br></div>");
+				me.page.main.find(".btn-get-records").hide();
+			}
+		}
+	});
+};
+
+var add_to_records = function(me, data){
+	var details = "<ul class='nav nav-pills nav-stacked'>";
+	var i;
+	for(i=0; i<data.length; i++){
+		if(data[i].reference_doctype){
+			let label = '';
+			if(data[i].subject){
+				label += "<br/>"+data[i].subject;
+			}
+			data[i] = add_date_separator(data[i]);
+			if(frappe.user_info(data[i].owner).image){
+				data[i].imgsrc = frappe.utils.get_file_link(frappe.user_info(data[i].owner).image);
+			}
+			else{
+				data[i].imgsrc = false;
+			}
+			var time_line_heading = data[i].practitioner ? `${data[i].practitioner} ` : ``;
+			time_line_heading += data[i].reference_doctype + " - "+ data[i].reference_name;
+			details += `<li data-toggle='pill' class='patient_doc_menu'
+			data-doctype='${data[i].reference_doctype}' data-docname='${data[i].reference_name}'>
+			<div class='col-sm-12 d-flex border-bottom py-3'>`;
+			if (data[i].imgsrc){
+				details += `<span class='mr-3'>
+					<img class='avtar' src='${data[i].imgsrc}' width='32' height='32'>
+					</img>
+			</span>`;
+			}else{
+				details += `<span class='mr-3 avatar avatar-small' style='width:32px; height:32px;'><div align='center' class='standard-image'
+					style='background-color: #fafbfc;'>${data[i].practitioner ? data[i].practitioner.charAt(0) : "U"}</div></span>`;
+			}
+			details += `<div class='d-flex flex-column width-full'>
+					<div>
+						`+time_line_heading+` on
+							<span>
+								${data[i].date_sep}
+							</span>
+					</div>
+					<div class='Box p-3 mt-2'>
+						<span class='${data[i].reference_name} document-id'>${label}
+							<div align='center'>
+								<a class='btn octicon octicon-chevron-down btn-default btn-xs btn-more'
+									data-doctype='${data[i].reference_doctype}' data-docname='${data[i].reference_name}'>
+								</a>
+							</div>
+						</span>
+						<span class='document-html' hidden  data-fetched="0">
+						</span>
+					</div>
+				</div>
+			</div>
+			</li>`;
+		}
+	}
+	details += "</ul>";
+	me.page.main.find(".patient_documents_list").append(details);
+	me.start += data.length;
+	if(data.length===20){
+		me.page.main.find(".btn-get-records").show();
+	}else{
+		me.page.main.find(".btn-get-records").hide();
+		me.page.main.find(".patient_documents_list").append("<div class='text-muted' align='center'><br><br>No more records..<br><br></div>");
+	}
+};
+
+var add_date_separator = function(data) {
+	var date = frappe.datetime.str_to_obj(data.creation);
+
+	var diff = frappe.datetime.get_day_diff(frappe.datetime.get_today(), frappe.datetime.obj_to_str(date));
+	if(diff < 1) {
+		var pdate = 'Today';
+	} else if(diff < 2) {
+		pdate = 'Yesterday';
+	} else {
+		pdate = frappe.datetime.global_date_format(date);
+	}
+	data.date_sep = pdate;
+	return data;
+};
+
+var show_patient_info = function(patient, me){
+	frappe.call({
+		"method": "erpnext.healthcare.doctype.patient.patient.get_patient_detail",
+		args: {
+			patient: patient
+		},
+		callback: function (r) {
+			var data = r.message;
+			var details = "";
+			if(data.image){
+				details += "<div><img class='thumbnail' width=75% src='"+data.image+"'></div>";
+			}
+			details += "<b>" + data.patient_name +"</b><br>" + data.sex;
+			if(data.email) details += "<br>" + data.email;
+			if(data.mobile) details += "<br>" + data.mobile;
+			if(data.occupation) details += "<br><br><b>Occupation :</b> " + data.occupation;
+			if(data.blood_group) details += "<br><b>Blood group : </b> " + data.blood_group;
+			if(data.allergies) details +=  "<br><br><b>Allergies : </b> "+  data.allergies.replace("\n", "<br>");
+			if(data.medication) details +=  "<br><b>Medication : </b> "+  data.medication.replace("\n", "<br>");
+			if(data.alcohol_current_use) details +=  "<br><br><b>Alcohol use : </b> "+  data.alcohol_current_use;
+			if(data.alcohol_past_use) details +=  "<br><b>Alcohol past use : </b> "+  data.alcohol_past_use;
+			if(data.tobacco_current_use) details +=  "<br><b>Tobacco use : </b> "+  data.tobacco_current_use;
+			if(data.tobacco_past_use) details +=  "<br><b>Tobacco past use : </b> "+  data.tobacco_past_use;
+			if(data.medical_history) details +=  "<br><br><b>Medical history : </b> "+  data.medical_history.replace("\n", "<br>");
+			if(data.surgical_history) details +=  "<br><b>Surgical history : </b> "+  data.surgical_history.replace("\n", "<br>");
+			if(data.surrounding_factors) details +=  "<br><br><b>Occupational hazards : </b> "+  data.surrounding_factors.replace("\n", "<br>");
+			if(data.other_risk_factors) details += "<br><b>Other risk factors : </b> " + data.other_risk_factors.replace("\n", "<br>");
+			if(data.patient_details) details += "<br><br><b>More info : </b> " + data.patient_details.replace("\n", "<br>");
+
+			if(details){
+				details = "<div style='padding-left:10px; font-size:13px;' align='center'>" + details + "</div>";
+			}
+			me.page.main.find(".patient_details").html(details);
+		}
+	});
+};
+
+var show_patient_vital_charts = function(patient, me, btn_show_id, pts, title) {
+	frappe.call({
+		method: "erpnext.healthcare.utils.get_patient_vitals",
+		args:{
+			patient: patient
+		},
+		callback: function(r) {
+			if (r.message){
+				var show_chart_btns_html = "<div style='padding-top:5px;'><a class='btn btn-default btn-xs btn-show-chart' \
+				data-show-chart-id='bp' data-pts='mmHg' data-title='Blood Pressure'>Blood Pressure</a>\
+				<a class='btn btn-default btn-xs btn-show-chart' data-show-chart-id='pulse_rate' \
+				data-pts='per Minutes' data-title='Respiratory/Pulse Rate'>Respiratory/Pulse Rate</a>\
+				<a class='btn btn-default btn-xs btn-show-chart' data-show-chart-id='temperature' \
+				data-pts='°C or °F' data-title='Temperature'>Temperature</a>\
+				<a class='btn btn-default btn-xs btn-show-chart' data-show-chart-id='bmi' \
+				data-pts='bmi' data-title='BMI'>BMI</a></div>";
+				me.page.main.find(".show_chart_btns").html(show_chart_btns_html);
+				var data = r.message;
+				let labels = [], datasets = [];
+				let bp_systolic = [], bp_diastolic = [], temperature = [];
+				let pulse = [], respiratory_rate = [], bmi = [], height = [], weight = [];
+				for(var i=0; i<data.length; i++){
+					labels.push(data[i].signs_date+"||"+data[i].signs_time);
+					if(btn_show_id=="bp"){
+						bp_systolic.push(data[i].bp_systolic);
+						bp_diastolic.push(data[i].bp_diastolic);
+					}
+					if(btn_show_id=="temperature"){
+						temperature.push(data[i].temperature);
+					}
+					if(btn_show_id=="pulse_rate"){
+						pulse.push(data[i].pulse);
+						respiratory_rate.push(data[i].respiratory_rate);
+					}
+					if(btn_show_id=="bmi"){
+						bmi.push(data[i].bmi);
+						height.push(data[i].height);
+						weight.push(data[i].weight);
+					}
+				}
+				if(btn_show_id=="temperature"){
+					datasets.push({name: "Temperature", values: temperature, chartType:'line'});
+				}
+				if(btn_show_id=="bmi"){
+					datasets.push({name: "BMI", values: bmi, chartType:'line'});
+					datasets.push({name: "Height", values: height, chartType:'line'});
+					datasets.push({name: "Weight", values: weight, chartType:'line'});
+				}
+				if(btn_show_id=="bp"){
+					datasets.push({name: "BP Systolic", values: bp_systolic, chartType:'line'});
+					datasets.push({name: "BP Diastolic", values: bp_diastolic, chartType:'line'});
+				}
+				if(btn_show_id=="pulse_rate"){
+					datasets.push({name: "Heart Rate / Pulse", values: pulse, chartType:'line'});
+					datasets.push({name: "Respiratory Rate", values: respiratory_rate, chartType:'line'});
+				}
+				new Chart( ".patient_vital_charts", {
+					data: {
+						labels: labels,
+						datasets: datasets
+					},
+
+					title: title,
+					type: 'axis-mixed', // 'axis-mixed', 'bar', 'line', 'pie', 'percentage'
+					height: 150,
+					colors: ['purple', '#ffa3ef', 'light-blue'],
+
+					tooltipOptions: {
+						formatTooltipX: d => (d + '').toUpperCase(),
+						formatTooltipY: d => d + ' ' + pts,
+					}
+				});
+			}else{
+				me.page.main.find(".patient_vital_charts").html("");
+				me.page.main.find(".show_chart_btns").html("");
+			}
+		}
+	});
+};
diff --git a/erpnext/healthcare/page/patient_history/patient_history.json b/erpnext/healthcare/page/patient_history/patient_history.json
new file mode 100644
index 0000000..b3892a4
--- /dev/null
+++ b/erpnext/healthcare/page/patient_history/patient_history.json
@@ -0,0 +1,28 @@
+{
+ "content": null, 
+ "creation": "2018-08-08 17:09:13.816199", 
+ "docstatus": 0, 
+ "doctype": "Page", 
+ "icon": "", 
+ "idx": 0, 
+ "modified": "2018-08-08 17:09:55.969424", 
+ "modified_by": "Administrator", 
+ "module": "Healthcare", 
+ "name": "patient_history", 
+ "owner": "Administrator", 
+ "page_name": "patient_history", 
+ "restrict_to_domain": "Healthcare", 
+ "roles": [
+  {
+   "role": "Healthcare Administrator"
+  }, 
+  {
+   "role": "Physician"
+  }
+ ], 
+ "script": null, 
+ "standard": "Yes", 
+ "style": null, 
+ "system_page": 0, 
+ "title": "Patient History"
+}
\ No newline at end of file
diff --git a/erpnext/healthcare/page/patient_history/patient_history.py b/erpnext/healthcare/page/patient_history/patient_history.py
new file mode 100644
index 0000000..772aa4e
--- /dev/null
+++ b/erpnext/healthcare/page/patient_history/patient_history.py
@@ -0,0 +1,39 @@
+# -*- coding: utf-8 -*-
+# Copyright (c) 2018, ESS LLP and contributors
+# For license information, please see license.txt
+
+from __future__ import unicode_literals
+import frappe
+from frappe.utils import cint
+from erpnext.healthcare.utils import render_docs_as_html
+
+@frappe.whitelist()
+def get_feed(name, start=0, page_length=20):
+	"""get feed"""
+	result = frappe.db.sql("""select name, owner, creation,
+		reference_doctype, reference_name, subject
+		from `tabPatient Medical Record`
+		where patient=%(patient)s
+		order by creation desc
+		limit %(start)s, %(page_length)s""",
+		{
+			"patient": name,
+			"start": cint(start),
+			"page_length": cint(page_length)
+		}, as_dict=True)
+	return result
+
+@frappe.whitelist()
+def get_feed_for_dt(doctype, docname):
+	"""get feed"""
+	result = frappe.db.sql("""select name, owner, modified, creation,
+			reference_doctype, reference_name, subject
+		from `tabPatient Medical Record`
+		where reference_name=%(docname)s and reference_doctype=%(doctype)s
+		order by creation desc""",
+		{
+			"docname": docname,
+			"doctype": doctype
+		}, as_dict=True)
+
+	return result
diff --git a/erpnext/healthcare/utils.py b/erpnext/healthcare/utils.py
index 6a226d9..97bb98f 100644
--- a/erpnext/healthcare/utils.py
+++ b/erpnext/healthcare/utils.py
@@ -429,3 +429,116 @@
 					occupancy_msg = str(occupied) + " Occupied out of " + str(occupancy_total)
 			each["occupied_out_of_vacant"] = occupancy_msg
 	return hc_service_units
+
+@frappe.whitelist()
+def get_patient_vitals(patient, from_date=None, to_date=None):
+	if not patient: return
+	vitals = frappe.db.sql("""select * from `tabVital Signs` where \
+	docstatus=1 and patient=%s order by signs_date, signs_time""", \
+	(patient), as_dict=1)
+	if vitals and vitals[0]:
+		return vitals
+	else:
+		return False
+
+@frappe.whitelist()
+def render_docs_as_html(docs):
+	# docs key value pair {doctype: docname}
+	docs_html = "<div class='col-md-12 col-sm-12 text-muted'>"
+	for doc in docs:
+		docs_html += render_doc_as_html(doc['doctype'], doc['docname'])['html'] + "<br/>"
+		return {'html': docs_html}
+
+@frappe.whitelist()
+def render_doc_as_html(doctype, docname, exclude_fields = []):
+	#render document as html, three column layout will break
+	doc = frappe.get_doc(doctype, docname)
+	meta = frappe.get_meta(doctype)
+	doc_html = "<div class='col-md-12 col-sm-12'>"
+	section_html = ""
+	section_label = ""
+	html = ""
+	sec_on = False
+	col_on = 0
+	has_data = False
+	for df in meta.fields:
+		#on section break append append previous section and html to doc html
+		if df.fieldtype == "Section Break":
+			if has_data and col_on and sec_on:
+				doc_html += section_html + html + "</div>"
+			elif has_data and not col_on and sec_on:
+				doc_html += "<div class='col-md-12 col-sm-12'\
+				><div class='col-md-12 col-sm-12'>" \
+				+ section_html + html +"</div></div>"
+			while col_on:
+				doc_html += "</div>"
+				col_on -= 1
+			sec_on = True
+			has_data= False
+			col_on = 0
+			section_html = ""
+			html = ""
+			if df.label:
+				section_label = df.label
+			continue
+		#on column break append html to section html or doc html
+		if df.fieldtype == "Column Break":
+			if sec_on and has_data:
+				section_html += "<div class='col-md-12 col-sm-12'\
+				><div class='col-md-6 col\
+				-sm-6'><b>" + section_label + "</b>" + html + "</div><div \
+				class='col-md-6 col-sm-6'>"
+			elif has_data:
+				doc_html += "<div class='col-md-12 col-sm-12'><div class='col-m\
+				d-6 col-sm-6'>" + html + "</div><div class='col-md-6 col-sm-6'>"
+			elif sec_on and not col_on:
+				section_html += "<div class='col-md-6 col-sm-6'>"
+			html = ""
+			col_on += 1
+			if df.label:
+				html += '<br>' + df.label
+			continue
+		#on table iterate in items and create table based on in_list_view, append to section html or doc html
+		if df.fieldtype == "Table":
+			items = doc.get(df.fieldname)
+			if not items: continue
+			child_meta = frappe.get_meta(df.options)
+			if not has_data : has_data = True
+			table_head = ""
+			table_row = ""
+			create_head = True
+			for item in items:
+				table_row += '<tr>'
+				for cdf in child_meta.fields:
+					if cdf.in_list_view:
+						if create_head:
+							table_head += '<th>' + cdf.label + '</th>'
+						if item.get(cdf.fieldname):
+							table_row += '<td>' + str(item.get(cdf.fieldname)) \
+							+ '</td>'
+						else:
+							table_row += '<td></td>'
+				create_head = False
+				table_row += '</tr>'
+			if sec_on:
+				section_html += '<table class="table table-condensed \
+				bordered">' + table_head +  table_row + '</table>'
+			else:
+				html += '<table class="table table-condensed table-bordered">' \
+				+ table_head +  table_row + '</table>'
+			continue
+		#on other field types add label and value to html
+		if not df.hidden and not df.print_hide and doc.get(df.fieldname) and df.fieldname not in exclude_fields:
+			html +=  "<br>{0} : {1}".format(df.label or df.fieldname, \
+			doc.get(df.fieldname))
+			if not has_data : has_data = True
+	if sec_on and col_on and has_data:
+		doc_html += section_html + html + "</div></div>"
+	elif sec_on and not col_on and has_data:
+		doc_html += "<div class='col-md-12 col-sm-12'\
+		><div class='col-md-12 col-sm-12'>" \
+		+ section_html + html +"</div></div>"
+	if doc_html:
+		doc_html = "<div class='small'><div class='col-md-12 text-right'><a class='btn btn-default btn-xs' href='#Form/%s/%s'></a></div>" %(doctype, docname) + doc_html + "</div>"
+
+	return {'html': doc_html}