File size: 8,060 Bytes
921d328
 
 
 
 
 
e32cb2d
921d328
 
 
52e12d8
 
 
 
 
 
 
 
921d328
 
 
52e12d8
 
 
 
 
 
 
921d328
e62c014
 
71d1d88
e62c014
52e12d8
 
 
 
 
e32cb2d
e62c014
 
aa33f8d
d92a6e7
e62c014
52e12d8
e32cb2d
e62c014
 
 
 
 
52e12d8
e62c014
52e12d8
0bb6af5
e62c014
 
 
 
0bb6af5
e62c014
88dcc52
 
 
12469f9
71d1d88
88dcc52
 
 
 
2e47d5d
 
 
 
e62c014
 
921d328
e62c014
e32cb2d
 
e62c014
 
52e12d8
061b31d
44d4011
 
 
52e12d8
 
e62c014
44d4011
 
 
 
 
 
e62c014
 
44d4011
 
 
e62c014
44d4011
 
 
e62c014
 
44d4011
 
52e12d8
44d4011
 
 
 
 
 
e62c014
44d4011
921d328
83709d1
 
 
5da4a53
561ceec
 
5da4a53
921d328
 
 
 
 
cac5db0
e32cb2d
e62c014
 
 
cc234be
e62c014
 
 
 
 
 
 
 
 
 
 
3b1a4d2
065e80b
e62c014
 
 
 
 
 
71d1d88
434f4e9
339db4d
71d1d88
434f4e9
e62c014
 
 
921d328
e62c014
b1e58c2
d28eb0b
fe018c1
 
b1e58c2
35afabe
ad5103f
e0bfb87
 
1db411a
e0bfb87
 
 
1db411a
e0bfb87
 
 
1db411a
e0bfb87
ad5103f
2b9125a
ad5103f
 
2e47d5d
ad5103f
 
 
2e47d5d
ad5103f
 
1ed57a7
9fbd50c
 
2e47d5d
9fbd50c
ad5103f
1ed57a7
bd8959a
89296e9
4be4601
9fbd50c
b1e58c2
 
4b3026a
54d5bde
e0bfb87
af46620
e62c014
 
2a1077d
44d4011
 
 
921d328
 
44d4011
 
 
 
 
921d328
3a1bcfa
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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Order Summary</title>
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
    <style>
        body {
            font-family: 'Arial', sans-serif;
            background-color: #fdf4e3; /* Light cream background */
            color: #333333; /* Dark gray text */
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            min-height: 100vh;
        }
        .order-container {
            max-width: 768px;
            margin: 40px auto;
            padding: 20px;
            background-color: #ffffff; /* White card background */
            border-radius: 15px;
            box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
            border: 1px solid #ffe5b4; /* Light orange border */
            flex-grow: 1;
        }
        .cart-item {
            display: flex;
            /* align-items: center; */
            justify-content: space-between;
            background-color: #fffcf5; /* Slightly lighter beige */
            border-radius: 8px;
            border: 1px solid #ffe5b4; /* Light orange border */
            padding: 10px;
            margin-bottom: 10px;
        }
        .cart-item img {
            width: 70px;
            height:70px;
            object-fit:cover;
            border-radius: 5px;
            border: 1px solid #ffcc80; /* Light orange border around images */
        }
        .cart-item-details {
            flex: 1;
            margin-left: 15px;
        }
        .cart-item-title {
            font-size: 1.2rem;
            font-weight: bold;
            color: #c04e01; /* Warm orange color for the title */
        }
        .cart-item-addons,
        .cart-item-instructions {
            font-size: 0.9rem;
            color: #6c757d;
        }
        .cart-item-actions {
    font-size: 1.2rem;
    font-weight: bold;
    color: #2b9348; /* Green for the price */
          margin-right:12px;
    
}



      .cart-item-actions1 {
            font-size: 1.2rem;
            font-weight: bold;
            color: #2b9348; /* Green for the price */
        }
        .order-summary {
            text-align: right;
            margin-top: 15px;
        }
        .total-price {
            font-size: 1.5rem;
            font-weight: bold;
            color: #2b9348; /* Green for the total price */
        }
        .back-to-menu {
            display: block;
            margin: 30px auto 10px auto;
            padding: 10px 20px;
            background-color: #ff5722; /* Bright orange button */
            color: #ffffff;
            border: none;
            border-radius: 25px;
            font-size: 1rem;
            font-weight: bold;
            text-align: center;
            text-decoration: none;
            width: 100%;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            transition: background-color 0.3s ease;
        }
        .back-to-menu:hover {
            background-color: #e64a19;
            text-decoration: none;
        }
        footer {
            background-color: #333333;
            color: #ffffff;
            text-align: center;
            padding: 15px 10px;
            margin-top: auto;
        }
        footer p {
            margin: 0;
            font-size: 1rem;
        }
        footer p span {
            color: #ffcc00;
            font-weight: bold;
        }
      .totsl_bill{
        max-width: 768px;
      }
      .yourorder{
        font-family:Serif;
        
      }
    </style>
</head>
<body>
    <div class="container">
        <div class="order-container">
            <h3 class="mb-4 text-center yourorder">Your Order Summary</h3>

            {% if order %}
                {% for line in order.Order_Details__c.split('\n') %}
                    {% set item_parts = line.split('|') %}
                    <div class="cart-item">
                        <!-- Item Image -->
                        <img src="{{ item_parts[4].strip().replace('Image:', '') }}" 
                             alt="{{ item_parts[0].strip() }}" 
                             onerror="this.src='/static/placeholder.jpg';">
                        
                        <!-- Item Details -->
                        <div class="cart-item-details">
                            <div class="cart-item-title">{{ item_parts[0].strip() }}</div> <!-- Item Name & Quantity -->
                            
                            <div class="cart-item-addons">
                                <small class="text-muted">Add-ons: {{ item_parts[1].strip().replace('Add-Ons:', '') }}</small>
                            </div>

                            <div class="cart-item-instructions">
                                <small class="text-muted">Instructions: {{ item_parts[2].strip().replace('Instructions:', '') }}</small>
                            </div>
                        </div>
                        
                        <!-- Price -->
                        <div class="cart-item-actions ">
                            <!-- <strong>{{ item_parts[3].strip().replace('Price:', '') }}</strong> -->
                          <!-- <strong>{{ item_parts[3].strip().replace('Price:', '')  }}</strong> -->
                          <span style="font-size: 16px; margin-left: 20px">{{ item_parts[3].strip().replace('Price:', '') }}</span>

                        </div>
                    </div>
                {% endfor %}

                <!-- Total Section -->
                <!-- <div class="order-summary mt-4">
                    <p><strong>Sub-Total:</strong> <span class="total-price">${{ order.Total_Amount__c }}</span></p>
                    <p><strong>Discount:</strong> <span class="total-price">${{ "%.2f"|format(order.Discount__c) }}</span></p>
                    <p><strong>Total Bill:</strong> <span class="total-price">${{ "%.2f"|format(order.Total_Bill__c) }}</span></p>
                </div> -->
  <div class="container mt-5 cart-item">
  <!-- <div class="container ">
        <div class="d-flex justify-content-between mb-3">
            <p><strong>Sub-Total:</strong></p>
            <p class="cart-item-actions">${{ order.Total_Amount__c }}</p>
        </div>
        <div class="d-flex justify-content-between mb-3">
            <p><strong>Discount:</strong></p>
            <p class="cart-item-actions">${{ "%.2f"|format(order.Discount__c) }}</p>
        </div>
        <div class="d-flex justify-content-between mb-3">
            <p><strong>Total Bill:</strong></p>
            <p class="cart-item-actions">${{ "%.2f"|format(order.Total_Bill__c) }}</p>
        </div>
     </div> -->
<div class="container">
    <div class="d-flex justify-content-between mb-3">
        <p><strong>Sub-Total:</strong></p>
        <p class="cart-item-actions1" style="font-size: 16px;">${{ order.Total_Amount__c }}</p>
    </div>
    <div class="d-flex justify-content-between mb-3">
        <p><strong>Discount:</strong></p>
        <p class="cart-item-actions1" style="font-size: 16px;">${{ "%.2f"|format(order.Discount__c) }}</p>
    </div>
    <!-- Add dotted line here -->
  <div style="border-bottom: 1px dotted #000; margin-bottom: 10px;"></div>
    <div class="d-flex justify-content-between mb-3">
        <p><strong>Total Bill:</strong></p>
        <p class="cart-item-actions1" style="font-size: 16px;">${{ "%.2f"|format(order.Total_Bill__c) }}</p>
    </div>
</div>
  




</div>





            {% else %}
                <p class="text-center">No order details available.</p>
            {% endif %}

            <!-- Back to Menu Button -->
            <a href="/menu" class="back-to-menu">Back to Menu</a>
        </div>
    </div>

    <!-- Footer -->
    <footer>
        <p>Thank you for dining with us! <span>We look forward to serving you again.</span></p>
    </footer>
</body>
</html>