Hugging Face's logo

Spaces:
abeea
/
Order
Running

App Files Community
abeea commited on
Commit
5f94980
·
verified ·
1 Parent(s): 9a4fb1b

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +175 -19
index.html CHANGED
@@ -1,19 +1,175 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>TikTok Services Order</title>
7
+ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
8
+ <style>
9
+ body {
10
+ background: #f7f7f7;
11
+ font-family: Arial, sans-serif;
12
+ }
13
+ .container {
14
+ max-width: 550px;
15
+ background: #fff;
16
+ padding: 25px;
17
+ border-radius: 10px;
18
+ box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
19
+ margin-top: 30px;
20
+ }
21
+ .title {
22
+ font-size: 22px;
23
+ font-weight: bold;
24
+ margin-bottom: 15px;
25
+ color: #333;
26
+ text-align: center;
27
+ }
28
+ .easypaisa {
29
+ background: #e9f7ef;
30
+ border: 2px solid #28a745;
31
+ padding: 12px;
32
+ border-radius: 8px;
33
+ font-weight: bold;
34
+ text-align: center;
35
+ margin-bottom: 20px;
36
+ font-size: 18px;
37
+ }
38
+ .btn-confirm {
39
+ background: red;
40
+ color: #fff;
41
+ font-weight: bold;
42
+ padding: 12px;
43
+ border: none;
44
+ border-radius: 6px;
45
+ width: 100%;
46
+ }
47
+ .btn-confirm:hover {
48
+ background: darkred;
49
+ }
50
+ </style>
51
+ </head>
52
+ <body>
53
+
54
+ <div class="container">
55
+ <div class="title">TikTok Service Order</div>
56
+
57
+ <div class="easypaisa">
58
+ Easypaisa Number: <br>
59
+ <span style="font-size:20px;color:#000;">03424844392</span><br>
60
+ Account Holder: <span style="color:#28a745;">Muhammad Abdullah</span>
61
+ </div>
62
+
63
+ <!-- Category -->
64
+ <div class="mb-3">
65
+ <label class="form-label">Categories List</label>
66
+ <select id="category" class="form-select" required>
67
+ <option value="" disabled selected>Select Category</option>
68
+ <option value="likes">TikTok Likes</option>
69
+ <option value="views">TikTok Views</option>
70
+ <option value="followers">TikTok Followers</option>
71
+ </select>
72
+ </div>
73
+
74
+ <!-- Link -->
75
+ <div class="mb-3">
76
+ <label class="form-label">TikTok Video/Profile Link</label>
77
+ <input type="text" id="link" class="form-control" placeholder="Paste your TikTok link" required>
78
+ </div>
79
+
80
+ <!-- Quantity -->
81
+ <div class="mb-3">
82
+ <label class="form-label">Quantity</label>
83
+ <input type="number" id="quantity" class="form-control" min="10" placeholder="Enter Quantity" required>
84
+ </div>
85
+
86
+ <!-- Total Charge -->
87
+ <div class="mb-3">
88
+ <label class="form-label">Total Charge (PKR)</label>
89
+ <input type="text" id="total" class="form-control" readonly>
90
+ </div>
91
+
92
+ <!-- Average Time -->
93
+ <div class="mb-3">
94
+ <label class="form-label">Average Time</label>
95
+ <input type="text" class="form-control" value="8 - 24 Hours" readonly>
96
+ </div>
97
+
98
+ <!-- Payment Screenshot -->
99
+ <div class="mb-3">
100
+ <label class="form-label">Upload Payment Screenshot</label>
101
+ <input type="file" id="screenshot" class="form-control" accept="image/*" required>
102
+ </div>
103
+
104
+ <!-- Confirm -->
105
+ <button class="btn-confirm" onclick="sendOrder()">Confirm Order</button>
106
+ </div>
107
+
108
+ <script>
109
+ // Prices (per 1000)
110
+ const prices = {
111
+ likes: 50, // 50 PKR per 1k Likes
112
+ views: 20, // 20 PKR per 1k Views
113
+ followers: 100 // 100 PKR per 1k Followers
114
+ };
115
+
116
+ const category = document.getElementById("category");
117
+ const quantity = document.getElementById("quantity");
118
+ const total = document.getElementById("total");
119
+
120
+ function calculateTotal() {
121
+ let cat = category.value;
122
+ let qty = parseInt(quantity.value);
123
+
124
+ if (cat && qty && qty > 0) {
125
+ let pricePer1000 = prices[cat];
126
+ let charge = (qty / 1000) * pricePer1000;
127
+ total.value = Math.ceil(charge) + " PKR";
128
+ } else {
129
+ total.value = "";
130
+ }
131
+ }
132
+
133
+ category.addEventListener("change", calculateTotal);
134
+ quantity.addEventListener("input", calculateTotal);
135
+
136
+ async function sendOrder() {
137
+ const webhookURL = "YOUR_DISCORD_WEBHOOK_URL"; // <-- Replace with your webhook
138
+
139
+ const cat = category.options[category.selectedIndex].text;
140
+ const link = document.getElementById("link").value;
141
+ const qty = quantity.value;
142
+ const charge = total.value;
143
+ const fileInput = document.getElementById("screenshot");
144
+
145
+ if (!cat || !link || !qty || !fileInput.files[0]) {
146
+ alert("⚠️ Please fill all fields and upload screenshot.");
147
+ return;
148
+ }
149
+
150
+ // Upload screenshot
151
+ const formData = new FormData();
152
+ formData.append("file", fileInput.files[0]);
153
+ formData.append("payload_json", JSON.stringify({
154
+ content: `📢 **New TikTok Order Received**\n\n` +
155
+ `📝 Category: ${cat}\n` +
156
+ `🔗 Link: ${link}\n` +
157
+ `📊 Quantity: ${qty}\n` +
158
+ `💰 Total Charge: ${charge}\n` +
159
+ `⏳ Avg Time: 8-24 Hours\n\n` +
160
+ `✅ Easypaisa: 03424844392 (Muhammad Abdullah)`
161
+ }));
162
+
163
+ await fetch(webhookURL, {
164
+ method: "POST",
165
+ body: formData
166
+ });
167
+
168
+ alert("✅ Order sent successfully!");
169
+ document.querySelector("form")?.reset();
170
+ total.value = "";
171
+ }
172
+ </script>
173
+
174
+ </body>
175
+ </html>