From 2a245af41597f23d238de81d6c15bac47ff52a34 Mon Sep 17 00:00:00 2001
From: mohamadreza <mohamadreza1388.org@gmail.com>
Date: Wed, 11 Sep 2024 16:32:13 +0330
Subject: [PATCH] feat(alert): add alert and validation

---
 script/script.js | 32 ++++++++++++++++++++++++++++----
 style/style.css  | 27 +++++++++++++++++++++++----
 2 files changed, 51 insertions(+), 8 deletions(-)

diff --git a/script/script.js b/script/script.js
index 8b0d390..bda252e 100644
--- a/script/script.js
+++ b/script/script.js
@@ -253,7 +253,31 @@ const in_login = () => {
 }
 
 const save_code = () => {
-    console.log("saved");
+    Swal.fire({
+        title: "عنوان کد را وارد کنید.",
+        input: "text",
+        inputAttributes: {
+            autocapitalize: "off"
+        },
+        showCancelButton: true,
+        confirmButtonText: "Look up",
+        showLoaderOnConfirm: true,
+        customClass: {
+            confirmButton: "save_btn_after"
+        },
+        preConfirm: (login) => {
+            if (login !== "") {
+                
+            }else {
+                Swal.fire({
+                    icon: "error",
+                    title: "لطفا اطلاعات را درست وارد نمایید",
+                    text: "فیلد عنوان نباید خالی باشد",
+                });
+            }
+        },
+        allowOutsideClick: () => !Swal.isLoading()
+    })
 }
 
 // Events
@@ -288,7 +312,7 @@ window.addEventListener('load', () => {
 
     if (getCookie("token") !== "") {
         token = getCookie("token")
-    }else {
+    } else {
         token = null
     }
 
@@ -306,7 +330,7 @@ window.addEventListener('load', () => {
         xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
         xhr.setRequestHeader('Authorization', token);
         xhr.send();
-    }else {
+    } else {
         elm_login_btn.style.display = "flex"
     }
 
@@ -346,7 +370,7 @@ elm_save.addEventListener("click", () => {
         xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
         xhr.setRequestHeader('Authorization', token);
         xhr.send();
-    }else {
+    } else {
         get_login()
     }
 })
diff --git a/style/style.css b/style/style.css
index d159254..2169d8e 100644
--- a/style/style.css
+++ b/style/style.css
@@ -276,12 +276,12 @@ div:where(.swal2-icon) {
 	margin: 1.5em auto .6em !important;
 }
 
-div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) {
-	background-color: #ff6200 !important;
+div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm),
+div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-cancel) {
 	border-radius: 10px !important;
 	width: 100px !important;
 	height: 50px !important;
-	display: flex !important;
+	display: flex;
 	justify-content: center !important;
 	align-items: center !important;
 	padding: 0 !important;
@@ -290,7 +290,8 @@ div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) {
 	overflow: hidden !important;
 }
 
-div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm)::after {
+div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm)::after,
+div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-cancel)::after {
 	width: 100%;
 	height: 100%;
 	position: absolute;
@@ -303,6 +304,24 @@ div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm)::a
 	content: "باشه";
 }
 
+.swal2-input{
+	border-radius: 10px;
+}
+
+div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm).save_btn_after::after{
+	content: "ذخیره";
+}
+
+div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-cancel)::after{
+	background-color: rgb(39 110 246);
+	content: "کنسل";
+}
+
+div:where(.swal2-container) div:where(.swal2-actions){
+	flex-direction: row-reverse;
+	gap: 10px;
+}
+
 .overlay {
 	position: fixed;
 	top: 0;