Hugging Face's logo

Spaces:
stat2025
/
EQ
Running

App Files Community
stat2025 commited on
Commit
052bd13
·
verified ·
1 Parent(s): 9af2a3a

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +147 -18
index.html CHANGED
@@ -1,19 +1,148 @@
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="ar" dir="rtl">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width,initial-scale=1" />
6
+ <title>بيان استلام الإقرارات</title>
7
+
8
+ <link rel="stylesheet" href="style.css" />
9
+ <!-- SheetJS (Excel Export) -->
10
+ <script src="https://cdn.jsdelivr.net/npm/xlsx@0.18.5/dist/xlsx.full.min.js"></script>
11
+ </head>
12
+
13
+ <body>
14
+ <div class="app">
15
+ <header class="topbar">
16
+ <div class="brand">
17
+ <div class="badge">بيان استلام</div>
18
+ <h1>إقرار الموافقة على مشاركة القوائم المالية في المركز السعودي للأعمال</h1>
19
+ <p class="subtitle">أدخل البيانات يدويًا ثم اضغط حفظ لإضافتها للجدول. البيانات تبقى محفوظة حتى تقوم بالحذف.</p>
20
+ </div>
21
+ <div class="meta">
22
+ <div class="stat">
23
+ <div class="stat-label">عدد السجلات</div>
24
+ <div class="stat-value" id="rowsCount">0</div>
25
+ </div>
26
+ <div class="stat">
27
+ <div class="stat-label">آخر حفظ</div>
28
+ <div class="stat-value" id="lastSaved">—</div>
29
+ </div>
30
+ </div>
31
+ </header>
32
+
33
+ <main class="grid">
34
+ <!-- Form Card -->
35
+ <section class="card">
36
+ <div class="card-title">إدخال البيانات</div>
37
+
38
+ <form id="entryForm" class="form" autocomplete="off">
39
+ <div class="row">
40
+ <label>
41
+ <span>اسم الشركة</span>
42
+ <input id="companyName" type="text" placeholder="مثال: شركة ..." required />
43
+ </label>
44
+
45
+ <label>
46
+ <span>السجل التجاري</span>
47
+ <input id="crNumber" type="text" inputmode="numeric" placeholder="مثال: 1010..." required />
48
+ </label>
49
+ </div>
50
+
51
+ <div class="row">
52
+ <label>
53
+ <span>اسم المستلم</span>
54
+ <input id="receiverName" type="text" placeholder="اسم المستلم" required />
55
+ </label>
56
+
57
+ <label>
58
+ <span>رقم الجوال</span>
59
+ <input id="mobile" type="tel" inputmode="tel" placeholder="05xxxxxxxx" required />
60
+ </label>
61
+ </div>
62
+
63
+ <div class="row">
64
+ <label class="full">
65
+ <span>البريد الإلكتروني</span>
66
+ <input id="email" type="email" placeholder="name@example.com" />
67
+ </label>
68
+ </div>
69
+
70
+ <div class="row">
71
+ <label>
72
+ <span>التاريخ</span>
73
+ <input id="date" type="date" required />
74
+ </label>
75
+
76
+ <label>
77
+ <span>التوقيع (كتابة)</span>
78
+ <input id="signatureText" type="text" placeholder="اكتب الاسم كتوقيع (اختياري)" />
79
+ </label>
80
+ </div>
81
+
82
+ <div class="sig-wrap">
83
+ <div class="sig-head">
84
+ <div>
85
+ <div class="sig-title">التوقيع (رسم)</div>
86
+ <div class="sig-hint">اختياري — ارسم التوقيع، ثم يمكنك مسحه</div>
87
+ </div>
88
+ <div class="sig-actions">
89
+ <button type="button" class="btn btn-ghost" id="clearSigBtn">مسح التوقيع</button>
90
+ </div>
91
+ </div>
92
+ <canvas id="sigCanvas" width="900" height="220" aria-label="Signature canvas"></canvas>
93
+ </div>
94
+
95
+ <div class="actions">
96
+ <input type="hidden" id="editId" value="" />
97
+ <button type="submit" class="btn btn-primary" id="saveBtn">حفظ</button>
98
+ <button type="button" class="btn btn-ghost" id="resetBtn">تفريغ الحقول</button>
99
+ </div>
100
+
101
+ <div class="note">
102
+ <strong>ملاحظة:</strong> البيانات تُحفظ على نفس الجهاز/المتصفح. إن فتحت الصفحة من جهاز آخر لن تظهر إلا إذا صدّرت Excel ونقلته.
103
+ </div>
104
+ </form>
105
+ </section>
106
+
107
+ <!-- Table Card -->
108
+ <section class="card">
109
+ <div class="card-head">
110
+ <div class="card-title">السجلات المحفوظة</div>
111
+ <div class="toolbar">
112
+ <input id="search" class="search" type="search" placeholder="بحث سريع: اسم شركة / ��جل / جوال ..." />
113
+ <button class="btn btn-secondary" id="exportBtn" type="button">تصدير Excel</button>
114
+ <button class="btn btn-danger" id="deleteAllBtn" type="button">حذف الكل</button>
115
+ </div>
116
+ </div>
117
+
118
+ <div class="table-wrap">
119
+ <table class="table" id="dataTable">
120
+ <thead>
121
+ <tr>
122
+ <th class="col-n">م</th>
123
+ <th>اسم الشركة</th>
124
+ <th>السجل التجاري</th>
125
+ <th>اسم المستلم</th>
126
+ <th>رقم الجوال</th>
127
+ <th>البريد الإلكتروني</th>
128
+ <th>التاريخ</th>
129
+ <th>التوقيع</th>
130
+ <th class="col-actions">إجراءات</th>
131
+ </tr>
132
+ </thead>
133
+ <tbody id="tableBody">
134
+ <!-- rows injected -->
135
+ </tbody>
136
+ </table>
137
+ </div>
138
+
139
+ <div class="footer-help">
140
+ يمكنك تعديل أي سجل أو حذفه. عند التصدير سيُنشأ ملف Excel يحتوي على كل السجلات الحالية.
141
+ </div>
142
+ </section>
143
+ </main>
144
+ </div>
145
+
146
+ <script src="app.js"></script>
147
+ </body>
148
+ </html>