Change input and add validation for date

SajadJalilian · Jan 5, 2024 · 8cbf09b · 8cbf09b
1 parent 817a1e7
commit 8cbf09b
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 6 deletions.
diff --git a/functions.js b/functions.js
@@ -9,9 +9,9 @@ function fetchData() {
         });
 };
 
-function calculateSum(value, date) {
+function calculateSum(value, year, month, day) {
     const rawData = this.data;
-    usdOnDate = rawData[date]["azadi1"]["sell"];
+    usdOnDate = rawData[CreateDate(year, month, day)]["azadi1"]["sell"];
 
     const keys = Object.keys(rawData);
     const lastKey = keys[keys.length - 1];
@@ -24,6 +24,11 @@ function calculateSum(value, date) {
 
     const rounded = Math.round(rialAtLastDate * 100) / 100;
     return { value: rounded, lastUsdValue: latestUsdValue, usdValueOnDate: usdOnDate }
+
+    function CreateDate(year, month, day) {
+        date = `${year}/${month.padStart(2, '0')}/${day.padStart(2, '0')}`;
+        return date;
+    }
 };
 
 function showData() {

diff --git a/index.html b/index.html
@@ -33,12 +33,23 @@
         <h1 class="">پول واقعی</h1>
         <p class="">مبلغ را به تومان و تاریخ را به شمسی وارد کنید</p>
 
-        <div
-            x-data="{ data: fetchData() , calcResult : '', rawData : '', userInputRial : '', userInputDate : '' , lastUsdValue : '', usdValueOnDate: ''}">
+        <div x-data="{ data: fetchData() ,
+                calcResult : '', 
+                rawData : '', 
+                userInputRial : '', 
+                userInputDay : '' , 
+                userInputMonth : '' , 
+                userInputYear : '' , 
+                lastUsdValue : '', 
+                usdValueOnDate: ''}">
             <input type="number" x-model="userInputRial" placeholder="مبلغ به تومان">
-            <input type="text" x-model="userInputDate" placeholder="1399/01/01">
+            <br>
+            <input type="number" min="01" max="31" x-model="userInputDay" placeholder="01">
+            <input type="number" min="01" max="12" x-model="userInputMonth" placeholder="01">
+            <input type="number" min="1391" x-model="userInputYear" placeholder="1399">
 
-            <button x-on:click="calcResult = calculateSum(userInputRial, userInputDate)" class="btn btn-primary">
+            <button x-on:click="calcResult = calculateSum(userInputRial, userInputYear, userInputMonth, userInputDay)"
+                class="btn btn-primary">
                 محاسبه‌
             </button>