i want to create a user profile section in an ERPNext dashboard workspace and display user details
@neha write all elements in html like this :
<div id="full_name"></div>
<div id="email"></div>
write js code to fill all the elements like this :
frappe.call({
method: "frappe.client.get",
args: {
doctype: "User",
name: frappe.session.user,
},
callback(r) {
if(r.message) {
root_element.querySelector("#full_name").textContent=r.message.full_name;
root_element.querySelector('#email').textContent=r.message.email;
}
}
});
you should see something like this :
next use css to beautify it .
Thank You!
How to display the Company details from company doctype?
How can the item button be fetched to display in the same way inside the custom html block
Because I do not want the page to be reloaded when I press the button
i want to fetch data from 2 defrent doctype one is user and one Client Doctype where have more dettials
frappe.call({
// method: “frappe.client.get”,
// args: {
// doctype: “User”,
// name: frappe.session.user,
// },
// callback: function(r_user) {
// if (r_user.message) {
// root_element.querySelector(“#full_name”).textContent = r_user.message.full_name;
// root_element.querySelector(“email”).textContent = r_user.message.email;
// // Fetch client information and other related data
// fetchClientInfo(r_user.message);
// }
// }
// });
// function fetchClientInfo(user_data) {
// frappe.call({
// method: “frappe.client.get_list”,
// args: {
// doctype: “Client”,
// filters: {
// email: user.email,
// client_name: user.first_name,
// business_name: user.full_name
// },
// fields: [“client_name”, “standards”, “certified_since”, “certified_expiry”, “ext”, “region”, “city”]
// },
// callback: function(r_client) {
// if (r_client.message && r_client.message.length > 0) {
// let clientData = r_client.message[0];
// // Update client info based on fetched data
// root_element.querySelector(“#client_name”).textContent = clientData.client_name;
// root_element.querySelector(“#standards”).textContent = clientData.standards;
// root_element.querySelector(“#certified_since”).textContent = clientData.certified_since;
// root_element.querySelector(“#certified_expiry”).textContent = clientData.certified_expiry;
// root_element.querySelector(“#ext”).textContent = clientData.ext;
// root_element.querySelector(“#region”).textContent = clientData.region;
// root_element.querySelector(“#city”).textContent = clientData.city;
// // Calculate remaining days
// let expiryDate = new Date(clientData.certified_expiry);
// let currentDate = new Date();
// let daysDifference = Math.ceil((expiryDate - currentDate) / (1000 * 60 * 60 * 24));
// root_element.querySelector(“#remaining_days”).textContent = daysDifference < 60 ? daysDifference + " days left" : “-”;
// }
// }
// });
// }
// frappe.call({
// method: “frappe.client.get”,
// args: {
// doctype: “User”,
// name: frappe.session.user,
// },
// callback: function(r_user) {
// if (r_user.message) {
// root_elemen(“full_name”).textContent = r_user.message.full_name;
// root_elemen(“email”).textContent = r_user.message.email;
// // Fetch client information and other related data
// fetchClientInfo(r_user.message);
// }
// }
// });
Thanks for the reference @bahaou , tried with something new learning.
<table class="table table-bordered table-condensed" id="task_table"></table>
frappe.call({
method: "frappe.client.get_list",
args: {
doctype: "Task",
filters: {
status: ['In',["Open", "Overdue"]]
},
fields: ["name", "subject", "status", "project", "priority"],
},
callback: function (response) {
if (response.message) {
populateTaskTable(response.message);
} else {
console.error("No task list data found.");
}
},
error: function (xhr, status, error) {
console.error("Error fetching task list:", error);
},
});
function populateTaskTable(tasks) {
var taskTable = root_element.querySelector("#task_table");
var tableHTML = "<thead>";
tableHTML += "<thead><tr><th>Task ID</th><th>Task</th><th>Status</th><th>Priority</th><th>Project</th></tr></thead>";
tableHTML += "<tbody>";
tasks.forEach(function (task) {
tableHTML += "<tr>";
tableHTML += "<td><a href='/app/task/" + task.name + "'>" + task.name + "</a></td>";
tableHTML += "<td>" + task.subject + "</td>";
var statusColor = task.status === "Overdue" ? "red" : "green";
tableHTML += "<td style='color: " + statusColor + ";'>" + task.status + "</td>";
var priorityColor = "";
switch(task.priority) {
case "Urgent":
priorityColor = "red";
break;
case "High":
priorityColor = "orange";
break;
case "Medium":
priorityColor = "#8B8000";
break;
case "Low":
priorityColor = "green";
break;
default:
priorityColor = "inherit";
}
tableHTML += "<td style='color: " + priorityColor + ";'>" + task.priority + "</td>";
tableHTML += "<td><a href='/app/project/" + task.project + "'>" + task.project + "</a></td>";
tableHTML += "</tr>";
});
tableHTML += "</tbody>";
taskTable.innerHTML = tableHTML;
}
Output:
the problem with this , that it’s not connected to user permission, any user will see same table data , even if he is not have the permission , how can i hide it based on session permissions user
if i created something like this
<div class="workspace-block-container">
<div class="workspace-section section-sales">Sales </div>
<div class="workspace-section-container">
<div class="workspace-block" data-doctype="Sales Order">
<a href="/app/sales-order">
how can i hide Sales Order or any other doctype based on user permission session, if he is not have permission on sales order , it should hide , how can i handle this
Please Check this
Could you please provide guidance on how to retrieve child table data and display it within a Custom HTML Box? Thank you!
Server logic is required for that case so check the post.
"Thank You for the answer! I’ll check the post.
I want show user image on new workspace
How can make the string translatabel