File size: 3,771 Bytes
f65f970 8fb83ea f5513ef c0caa98 f5513ef c0caa98 f5513ef c0caa98 f5513ef c0caa98 9b01074 c0caa98 9b01074 f65f970 c0caa98 f5513ef 9b01074 c0caa98 f5513ef c0caa98 f5513ef 9b01074 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 |
import gradio as gr
from simple_salesforce import Salesforce
# Salesforce Connection
sf = Salesforce(username='[email protected]', password='Sati@1020', security_token='sSSjyhInIsUohKpG8sHzty2q')
# Fetch menu items from Salesforce
def fetch_menu():
query = "SELECT Id, Name, Price__c, Description__c, Image1__c, Veg_NonVeg__c, Section__c FROM Menu_Item__c"
result = sf.query(query)
return result['records']
# Fetch add-ons from Salesforce
def fetch_add_ons():
query = "SELECT Id, Name, Price__c, Menu_Item__c FROM Add_Ons__c"
result = sf.query(query)
return result['records']
# Generate HTML for the menu items
def generate_menu_html(menu_items, add_ons, preference):
html = ""
sections = set(item['Section__c'] for item in menu_items)
for section in sorted(sections):
html += f"<h2>{section}</h2><div style='display: flex; flex-wrap: wrap; gap: 20px;'>"
for item in menu_items:
if item['Section__c'] == section and (preference == 'All' or item['Veg_NonVeg__c'] == preference):
item_add_ons = [addon for addon in add_ons if addon['Menu_Item__c'] == item['Id']]
add_ons_html = "".join(
f"<div><input type='checkbox' value='{addon['Name']}' data-price='{addon['Price__c']}'> {addon['Name']} (+${addon['Price__c']})</div>"
for addon in item_add_ons
)
html += f"""
<div style='width: 300px; border: 1px solid #ddd; padding: 10px; border-radius: 8px;'>
<img src='{item['Image1__c']}' alt='{item['Name']}' style='width: 100%; height: 150px; object-fit: cover; border-radius: 8px;'>
<h3>{item['Name']}</h3>
<p>{item['Description__c']}</p>
<p>Price: ${item['Price__c']}</p>
<button onclick="openPopup('{item['Name']}', '{item['Price__c']}', '{item['Image1__c']}', `{add_ons_html}`)">Customize & Add</button>
</div>
"""
html += "</div>"
return html
# JavaScript for popup functionality
popup_script = """
<script>
function openPopup(name, price, image, addOnsHtml) {
const popup = document.getElementById('popup');
popup.style.display = 'block';
document.getElementById('popup-name').innerText = name;
document.getElementById('popup-price').innerText = `$${price}`;
document.getElementById('popup-image').src = image;
document.getElementById('popup-addons').innerHTML = addOnsHtml;
}
function closePopup() {
document.getElementById('popup').style.display = 'none';
}
</script>
"""
# Gradio app
with gr.Blocks() as app:
with gr.Row():
gr.Markdown("# Welcome to Biryani Hub")
preference = gr.Radio(label="Filter Preference", choices=["All", "Veg", "Non-Veg"], value="All")
menu_html = gr.HTML()
with gr.Row():
gr.HTML("""
<div id='popup' style='display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.2);'>
<img id='popup-image' src='' alt='' style='width: 100%; height: 150px; object-fit: cover; border-radius: 8px;'>
<h2 id='popup-name'></h2>
<p id='popup-price'></p>
<div id='popup-addons'></div>
<button onclick='closePopup()'>Close</button>
</div>
""" + popup_script)
def update_menu(preference):
menu_items = fetch_menu()
add_ons = fetch_add_ons()
return generate_menu_html(menu_items, add_ons, preference)
preference.change(update_menu, inputs=preference, outputs=menu_html)
app.launch()
|