penambahan data penelitian
This commit is contained in:
Naufalakram
parent
4b340095a6
commit
c1514a4b2e
Binary file not shown.
|
|
@ -1,6 +1,5 @@
|
||||||
# env folder
|
# env folder
|
||||||
env/
|
env/
|
||||||
faces/
|
faces/
|
||||||
image1.jpg
|
__pycache__/
|
||||||
image2.jpg
|
*.jpg
|
||||||
image3.jpg
|
|
||||||
339
absensi.json
339
absensi.json
|
|
@ -1,50 +1,319 @@
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
"date": "22/09/2023",
|
"date": "23/02/2024",
|
||||||
"absensi": [
|
|
||||||
{
|
|
||||||
"name": "Aran",
|
|
||||||
"jam_masuk": "00:04:01",
|
|
||||||
"jam_keluar": "13:14:01"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"date": "22/10/2023",
|
|
||||||
"absensi": [
|
|
||||||
{
|
|
||||||
"name": "Aran",
|
|
||||||
"jam_masuk": "00:04:01",
|
|
||||||
"jam_keluar": "13:14:01"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"date": "23/11/2023",
|
|
||||||
"absensi": [
|
|
||||||
{
|
|
||||||
"name": "Aran",
|
|
||||||
"jam_masuk": "00:04:01",
|
|
||||||
"jam_keluar": "13:14:01"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"date": "23/11/2023",
|
|
||||||
"absensi": [
|
"absensi": [
|
||||||
{
|
{
|
||||||
"name": "Naufal",
|
"name": "Naufal",
|
||||||
"jam_masuk": "00:04:01",
|
"jam_masuk": "20:28:59",
|
||||||
"jam_keluar": "13:14:01"
|
"jam_keluar": "20:50:27"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Aran",
|
||||||
|
"jam_masuk": "20:29:03",
|
||||||
|
"jam_keluar": "20:29:06"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"date": "25/11/2023",
|
"date": "27/02/2024",
|
||||||
|
"absensi": [
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "16:31:23",
|
||||||
|
"jam_keluar": "16:31:35"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"date": "07/03/2024",
|
||||||
"absensi": [
|
"absensi": [
|
||||||
{
|
{
|
||||||
"name": "Aran",
|
"name": "Aran",
|
||||||
"jam_masuk": "00:14:28"
|
"jam_masuk": "16:58:46",
|
||||||
|
"jam_keluar": "17:02:35"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "16:58:46",
|
||||||
|
"jam_keluar": "17:02:35"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"date": "13/03/2024",
|
||||||
|
"absensi": [
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "23:34:34",
|
||||||
|
"jam_keluar": "23:35:15"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"date": "24/03/2024",
|
||||||
|
"absensi": [
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "13:09:36",
|
||||||
|
"jam_keluar": "13:10:54"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"date": "25/03/2024",
|
||||||
|
"absensi": [
|
||||||
|
{
|
||||||
|
"name": "Armin",
|
||||||
|
"jam_masuk": "10:35:37"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "10:42:31",
|
||||||
|
"jam_keluar": "12:57:56"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Zul",
|
||||||
|
"jam_masuk": "10:42:42"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ramli",
|
||||||
|
"jam_masuk": "10:42:58"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Dyah",
|
||||||
|
"jam_masuk": "10:43:15"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Radit",
|
||||||
|
"jam_masuk": "11:03:55"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"date": "27/03/2024",
|
||||||
|
"absensi": [
|
||||||
|
{
|
||||||
|
"name": "Armin",
|
||||||
|
"jam_masuk": "08:51:09",
|
||||||
|
"jam_keluar": "13:10:15"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Dyah",
|
||||||
|
"jam_masuk": "08:53:23",
|
||||||
|
"jam_keluar": "13:06:21"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Arjun",
|
||||||
|
"jam_masuk": "08:54:03",
|
||||||
|
"jam_keluar": "13:10:03"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ayyub",
|
||||||
|
"jam_masuk": "08:54:35",
|
||||||
|
"jam_keluar": "13:10:01"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Zul",
|
||||||
|
"jam_masuk": "08:54:45",
|
||||||
|
"jam_keluar": "13:10:08"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "09:01:23",
|
||||||
|
"jam_keluar": "13:11:09"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Adit",
|
||||||
|
"jam_masuk": "09:01:57",
|
||||||
|
"jam_keluar": "13:09:55"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ramli",
|
||||||
|
"jam_masuk": "09:07:24",
|
||||||
|
"jam_keluar": "13:10:12"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Radit",
|
||||||
|
"jam_masuk": "09:24:40",
|
||||||
|
"jam_keluar": "13:09:58"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Adi",
|
||||||
|
"jam_masuk": "09:24:43",
|
||||||
|
"jam_keluar": "13:06:34"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"date": "28/03/2024",
|
||||||
|
"absensi": [
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "11:03:55",
|
||||||
|
"jam_keluar": "13:48:18"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Aran",
|
||||||
|
"jam_masuk": "11:03:57"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Radit",
|
||||||
|
"jam_masuk": "11:04:12",
|
||||||
|
"jam_keluar": "13:47:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Dyah",
|
||||||
|
"jam_masuk": "11:05:12",
|
||||||
|
"jam_keluar": "13:47:14"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Adi",
|
||||||
|
"jam_masuk": "11:05:16",
|
||||||
|
"jam_keluar": "13:47:11"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Adit",
|
||||||
|
"jam_masuk": "11:05:21",
|
||||||
|
"jam_keluar": "13:47:03"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ayyub",
|
||||||
|
"jam_masuk": "11:05:28",
|
||||||
|
"jam_keluar": "13:46:57"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Arjun",
|
||||||
|
"jam_masuk": "11:05:31",
|
||||||
|
"jam_keluar": "13:46:52"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Zul",
|
||||||
|
"jam_masuk": "11:05:33",
|
||||||
|
"jam_keluar": "13:48:18"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ramli",
|
||||||
|
"jam_masuk": "11:05:36",
|
||||||
|
"jam_keluar": "13:46:36"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Armin",
|
||||||
|
"jam_masuk": "11:05:38",
|
||||||
|
"jam_keluar": "13:46:29"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"date": "29/03/2024",
|
||||||
|
"absensi": [
|
||||||
|
{
|
||||||
|
"name": "Radit",
|
||||||
|
"jam_masuk": "10:30:09",
|
||||||
|
"jam_keluar": "16:05:32"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "10:30:09",
|
||||||
|
"jam_keluar": "16:04:09"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Dyah",
|
||||||
|
"jam_masuk": "10:34:38",
|
||||||
|
"jam_keluar": "16:06:05"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Adit",
|
||||||
|
"jam_masuk": "10:34:52",
|
||||||
|
"jam_keluar": "16:06:03"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Adi",
|
||||||
|
"jam_masuk": "10:34:56",
|
||||||
|
"jam_keluar": "16:05:40"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Arjun",
|
||||||
|
"jam_masuk": "10:35:08",
|
||||||
|
"jam_keluar": "16:05:19"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Zul",
|
||||||
|
"jam_masuk": "10:35:24",
|
||||||
|
"jam_keluar": "16:05:12"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Armin",
|
||||||
|
"jam_masuk": "10:35:34",
|
||||||
|
"jam_keluar": "16:05:02"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ramli",
|
||||||
|
"jam_masuk": "10:35:38",
|
||||||
|
"jam_keluar": "16:05:06"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ayyub",
|
||||||
|
"jam_masuk": "10:36:00",
|
||||||
|
"jam_keluar": "16:05:26"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"date": "03/04/2024",
|
||||||
|
"absensi": [
|
||||||
|
{
|
||||||
|
"name": "Naufal",
|
||||||
|
"jam_masuk": "10:15:09",
|
||||||
|
"jam_keluar": "15:04:09"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Radit",
|
||||||
|
"jam_masuk": "10:15:11",
|
||||||
|
"jam_keluar": "15:04:26"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Armin",
|
||||||
|
"jam_masuk": "10:15:29",
|
||||||
|
"jam_keluar": "15:04:10"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Dyah",
|
||||||
|
"jam_masuk": "10:15:30",
|
||||||
|
"jam_keluar": "15:04:35"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ramli",
|
||||||
|
"jam_masuk": "10:16:08",
|
||||||
|
"jam_keluar": "15:04:15"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Ayyub",
|
||||||
|
"jam_masuk": "10:17:00",
|
||||||
|
"jam_keluar": "15:04:29"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Aran",
|
||||||
|
"jam_masuk": "10:20:02"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Zul",
|
||||||
|
"jam_masuk": "10:20:34",
|
||||||
|
"jam_keluar": "15:04:23"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Adi",
|
||||||
|
"jam_masuk": "10:26:48",
|
||||||
|
"jam_keluar": "15:04:38"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Arjun",
|
||||||
|
"jam_masuk": "10:28:08",
|
||||||
|
"jam_keluar": "15:04:20"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Adit",
|
||||||
|
"jam_masuk": "10:30:32",
|
||||||
|
"jam_keluar": "15:04:31"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -1 +1 @@
|
||||||
[{"name": "Naufal", "nik": "1", "gaji": 50000}, {"name": "Aran", "nik": "12345", "gaji": 20000}]
|
[{"name": "Naufal", "nik": "1", "gaji": 50000}, {"name": "Armin", "nik": "7372033007880005", "gaji": 50000}, {"name": "Dyah", "nik": "7372017112850107", "gaji": 50000}, {"name": "Ramli", "nik": "7372011502720001", "gaji": 50000}, {"name": "Zul", "nik": "7372012010010006", "gaji": 30000}, {"name": "Ayyub", "nik": "7372032007840005", "gaji": 50000}, {"name": "Adit", "nik": "7372021506960009", "gaji": 100000}, {"name": "Arjun", "nik": "73720416604010002", "gaji": 50000}, {"name": "Radit", "nik": "7372043112880024", "gaji": 50000}, {"name": "Adi", "nik": "7372041012970004", "gaji": 50000}]
|
||||||
17
flask_app.py
17
flask_app.py
|
|
@ -1,8 +1,10 @@
|
||||||
from flask import Flask, render_template , request
|
from flask import Flask, render_template , request,send_from_directory, abort
|
||||||
import subprocess
|
import subprocess
|
||||||
import threading
|
import threading
|
||||||
import json
|
import json
|
||||||
import time
|
import time
|
||||||
|
from werkzeug.utils import secure_filename
|
||||||
|
import os
|
||||||
|
|
||||||
dataset = "dataset.json"
|
dataset = "dataset.json"
|
||||||
absensi = "absensi.json"
|
absensi = "absensi.json"
|
||||||
|
|
@ -60,6 +62,14 @@ def home():
|
||||||
|
|
||||||
return render_template('index.html', data=all_data, length=len_all_data, today_date=today_date)
|
return render_template('index.html', data=all_data, length=len_all_data, today_date=today_date)
|
||||||
|
|
||||||
|
|
||||||
|
@app.route('/faces/<path:filename>')
|
||||||
|
def serve_image(filename):
|
||||||
|
try:
|
||||||
|
return send_from_directory('faces', filename)
|
||||||
|
except FileNotFoundError:
|
||||||
|
abort(404)
|
||||||
|
|
||||||
@app.route('/cek_absensi')
|
@app.route('/cek_absensi')
|
||||||
def cek_absensi():
|
def cek_absensi():
|
||||||
today_date = time.strftime("%d/%m/%Y")
|
today_date = time.strftime("%d/%m/%Y")
|
||||||
|
|
@ -150,9 +160,14 @@ def tambah_karyawan_post():
|
||||||
nama = request.form['nama']
|
nama = request.form['nama']
|
||||||
nik = request.form['nik']
|
nik = request.form['nik']
|
||||||
gaji = int(request.form['gaji'])
|
gaji = int(request.form['gaji'])
|
||||||
|
foto = request.files['file']
|
||||||
# print(nama)
|
# print(nama)
|
||||||
# print(nik)
|
# print(nik)
|
||||||
|
|
||||||
|
if foto:
|
||||||
|
foto_filename = secure_filename(nama + '.jpg')
|
||||||
|
foto.save(os.path.join('faces', foto_filename))
|
||||||
|
|
||||||
# open the dataset file
|
# open the dataset file
|
||||||
with open(dataset, 'r') as f:
|
with open(dataset, 'r') as f:
|
||||||
data = json.load(f)
|
data = json.load(f)
|
||||||
|
|
|
||||||
5
main.py
5
main.py
|
|
@ -16,7 +16,7 @@ today_date = time.strftime("%d/%m/%Y")
|
||||||
with open(absensi_file, 'r') as f:
|
with open(absensi_file, 'r') as f:
|
||||||
data = json.load(f)
|
data = json.load(f)
|
||||||
|
|
||||||
def face_confidence(face_distance, face_match_threshold=0.6):
|
def face_confidence(face_distance, face_match_threshold=0.6): #jika nilai face distance lebih kecil dari 0.6
|
||||||
range = (1.0 - face_match_threshold)
|
range = (1.0 - face_match_threshold)
|
||||||
linear_val = (1.0 - face_distance) / (range * 2.0)
|
linear_val = (1.0 - face_distance) / (range * 2.0)
|
||||||
|
|
||||||
|
|
@ -26,6 +26,7 @@ def face_confidence(face_distance, face_match_threshold=0.6):
|
||||||
value = (linear_val + ((1.0 - linear_val) * math.pow((linear_val - 0.5) * 2, 0.2))) * 100
|
value = (linear_val + ((1.0 - linear_val) * math.pow((linear_val - 0.5) * 2, 0.2))) * 100
|
||||||
return str(round(value, 2)) + "%"
|
return str(round(value, 2)) + "%"
|
||||||
|
|
||||||
|
# melakukan fungsi face recognition
|
||||||
class FaceRecognition:
|
class FaceRecognition:
|
||||||
face_locations = []
|
face_locations = []
|
||||||
face_encodings = []
|
face_encodings = []
|
||||||
|
|
@ -59,7 +60,7 @@ class FaceRecognition:
|
||||||
sys.exit('Video capture is not opened')
|
sys.exit('Video capture is not opened')
|
||||||
|
|
||||||
no_face_timer = 0
|
no_face_timer = 0
|
||||||
no_face_threshold = 5 # Adjust this to your desired timeout in seconds
|
no_face_threshold = 60 # Adjust this to your desired timeout in seconds
|
||||||
|
|
||||||
while True:
|
while True:
|
||||||
ret, frame = video_capture.read()
|
ret, frame = video_capture.read()
|
||||||
|
|
|
||||||
4
main2.py
4
main2.py
|
|
@ -1,7 +1,8 @@
|
||||||
|
# daftar karyawan baru menggunakan haarcascade
|
||||||
import cv2
|
import cv2
|
||||||
import json
|
import json
|
||||||
|
|
||||||
dataset = "dataset.json"
|
dataset = "dataset.json" # dataset karyawan
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -24,6 +25,7 @@ cv2.namedWindow('Image Capture', cv2.WINDOW_NORMAL)
|
||||||
# Set the window to full screen
|
# Set the window to full screen
|
||||||
cv2.setWindowProperty('Image Capture', cv2.WND_PROP_FULLSCREEN, cv2.WINDOW_FULLSCREEN)
|
cv2.setWindowProperty('Image Capture', cv2.WND_PROP_FULLSCREEN, cv2.WINDOW_FULLSCREEN)
|
||||||
|
|
||||||
|
|
||||||
face_cascade = cv2.CascadeClassifier(cv2.data.haarcascades + 'haarcascade_frontalface_default.xml')
|
face_cascade = cv2.CascadeClassifier(cv2.data.haarcascades + 'haarcascade_frontalface_default.xml')
|
||||||
|
|
||||||
while True:
|
while True:
|
||||||
|
|
|
||||||
|
|
@ -51,14 +51,14 @@
|
||||||
|
|
||||||
<div id="wrapper">
|
<div id="wrapper">
|
||||||
<div class="main-content container">
|
<div class="main-content container">
|
||||||
<div class="row small-spacing">
|
<!-- <div class="row small-spacing">
|
||||||
<div class="col-lg-4 col-md-4 col-xs-6">
|
<div class="col-lg-4 col-md-4 col-xs-6">
|
||||||
<div class="box-content bg-success text-white" style="background :grey;cursor: pointer;"
|
<div class="box-content bg-success text-white" style="background :grey;cursor: pointer;"
|
||||||
onclick="goto('home')">
|
onclick="goto('home')">
|
||||||
<h4 class="box-title">Halaman Utama</h4>
|
<h4 class="box-title">Halaman Utama</h4>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.box-content -->
|
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-4 col-md-4 col-xs-6">
|
<div class="col-lg-4 col-md-4 col-xs-6">
|
||||||
<div class="box-content bg-info text-white" style="background :grey;cursor: pointer"
|
<div class="box-content bg-info text-white" style="background :grey;cursor: pointer"
|
||||||
|
|
@ -66,9 +66,9 @@
|
||||||
<h4 class=" box-title">Tambah Data Karyawan</h4>
|
<h4 class=" box-title">Tambah Data Karyawan</h4>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.box-content -->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
<!-- create a button on center of this -->
|
<!-- create a button on center of this -->
|
||||||
<div class="row small-spacing text-center">
|
<div class="row small-spacing text-center">
|
||||||
<a href="{{url_for('scan_face')}}" class="btn btn-primary btn-bordered waves-effect waves-light">Lakukan
|
<a href="{{url_for('scan_face')}}" class="btn btn-primary btn-bordered waves-effect waves-light">Lakukan
|
||||||
|
|
@ -127,7 +127,7 @@
|
||||||
|
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>2023 © Naufal.</li>
|
<li>2024 ©CV.TIRTA RAHMAN PAREPARE.</li>
|
||||||
<!-- <li><a href="#">Privacy</a></li>
|
<!-- <li><a href="#">Privacy</a></li>
|
||||||
<li><a href="#">Terms</a></li>
|
<li><a href="#">Terms</a></li>
|
||||||
<li><a href="#">Help</a></li> -->
|
<li><a href="#">Help</a></li> -->
|
||||||
|
|
|
||||||
|
|
@ -2,257 +2,260 @@
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||||
<meta name="description" content="">
|
<meta name="description" content="" />
|
||||||
<meta name="author" content="">
|
<meta name="author" content="" />
|
||||||
|
|
||||||
<title>Sistem Absensi - Halaman Utama</title>
|
<title>Sistem Absensi - Cek Absensi</title>
|
||||||
|
|
||||||
<!-- Main Styles -->
|
<!-- Main Styles -->
|
||||||
<link rel="stylesheet" href="assets/styles/style-horizontal.min.css">
|
<link rel="stylesheet" href="assets/styles/style-horizontal.min.css" />
|
||||||
|
|
||||||
<!-- mCustomScrollbar -->
|
<!-- mCustomScrollbar -->
|
||||||
<link rel="stylesheet" href="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
|
<link rel="stylesheet" href="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css" />
|
||||||
|
|
||||||
<!-- Waves Effect -->
|
<!-- Waves Effect -->
|
||||||
<link rel="stylesheet" href="assets/plugin/waves/waves.min.css">
|
<link rel="stylesheet" href="assets/plugin/waves/waves.min.css" />
|
||||||
|
|
||||||
<!-- Sweet Alert -->
|
<!-- Sweet Alert -->
|
||||||
<link rel="stylesheet" href="assets/plugin/sweet-alert/sweetalert.css">
|
<link rel="stylesheet" href="assets/plugin/sweet-alert/sweetalert.css" />
|
||||||
|
|
||||||
<!-- Color Picker -->
|
<!-- Color Picker -->
|
||||||
<link rel="stylesheet" href="assets/color-switcher/color-switcher.min.css">
|
<link rel="stylesheet" href="assets/color-switcher/color-switcher.min.css" />
|
||||||
<link rel="stylesheet" href="assets/plugin/datatables/media/css/dataTables.bootstrap.min.css">
|
<link rel="stylesheet" href="assets/plugin/datatables/media/css/dataTables.bootstrap.min.css" />
|
||||||
<link rel="stylesheet" href="assets/plugin/datatables/extensions/Responsive/css/responsive.bootstrap.min.css">
|
<link rel="stylesheet" href="assets/plugin/datatables/extensions/Responsive/css/responsive.bootstrap.min.css" />
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="fixed-header">
|
<header class="fixed-header">
|
||||||
<div class="header-top">
|
<div class="header-top">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="pull-left">
|
<div class="pull-left">
|
||||||
<a href="" class="logo">Sistem Absensi</a>
|
<a href="" class="logo">Sistem Absensi</a>
|
||||||
</div>
|
</div>
|
||||||
<!-- /.pull-left -->
|
<!-- /.pull-left -->
|
||||||
|
|
||||||
<!-- /.pull-right -->
|
<!-- /.pull-right -->
|
||||||
</div>
|
</div>
|
||||||
<!-- /.container -->
|
<!-- /.container -->
|
||||||
</div>
|
</div>
|
||||||
<!-- /.header-top -->
|
<!-- /.header-top -->
|
||||||
|
|
||||||
<!-- /.nav-horizontal -->
|
<!-- /.nav-horizontal -->
|
||||||
</header>
|
</header>
|
||||||
<!-- /.fixed-header -->
|
<!-- /.fixed-header -->
|
||||||
|
|
||||||
|
<div id="wrapper">
|
||||||
|
<div class="main-content container">
|
||||||
|
<div class="row small-spacing">
|
||||||
|
<div class="col-xs-2 col-md-2"></div>
|
||||||
|
<div class="col-xs-8 col-md-8">
|
||||||
|
<div class="box-content card">
|
||||||
|
<h4 class="box-title">Tanggal : {{today_date}}</h4>
|
||||||
|
<div class="card-content">
|
||||||
|
<table id="example" class="table table-striped table-bordered display" style="width: 100%">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<td><b>Nama</b></td>
|
||||||
|
<td><b>Jam Masuk</b></td>
|
||||||
|
<td><b>Jam Keluar</b></td>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{%if data %} {% for i in range(0, length) %}
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<td>{{data[i]['name']}}</td>
|
||||||
|
<!-- if jam keluar doesn't exist , then show "-" -->
|
||||||
|
{% if data[i]['jam_keluar'] %}
|
||||||
|
<td>{{data[i]['jam_masuk']}}</td>
|
||||||
|
<td>{{data[i]['jam_keluar']}}</td>
|
||||||
|
{% else %}
|
||||||
|
<td>{{data[i]['jam_masuk']}}</td>
|
||||||
|
<td>-</td>
|
||||||
|
{% endif %}
|
||||||
|
</tr>
|
||||||
|
{% endfor %} {% else %}
|
||||||
|
<tr>
|
||||||
|
<td colspan="3" class="text-center">Tidak ada data</td>
|
||||||
|
</tr>
|
||||||
|
{% endif %}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-xs-2 col-md-2"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="wrapper">
|
<div class="row small-spacing">
|
||||||
<div class="main-content container">
|
<div class="col-xs-2 col-md-2"></div>
|
||||||
|
<div class="col-xs-8 col-md-8">
|
||||||
|
<div class="box-content card">
|
||||||
|
<h4 class="box-title">Bulan/Tahun : {{bulan_ini}}</h4>
|
||||||
|
<div class="card-content">
|
||||||
|
<table id="example" class="table table-striped table-bordered display" style="width: 100%">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<td><b>Nama</b></td>
|
||||||
|
<td><b>Gaji/Hari</b></td>
|
||||||
|
<td><b>Pendapatan/Bulan</b></td>
|
||||||
|
<td><b>Aksi</b></td>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{%if data_karyawan %} {% for i in range(0, length_karyawan) %}
|
||||||
|
|
||||||
<div class="row small-spacing">
|
<tr>
|
||||||
<div class="col-xs-2 col-md-2"></div>
|
<td>{{data_karyawan[i]['name']}}</td>
|
||||||
<div class="col-xs-8 col-md-8">
|
<td class="gajinya">{{data_karyawan[i]['gaji']}}</td>
|
||||||
<div class="box-content card">
|
<td class="gajinya">{{data_karyawan[i]['pendapatan']}}</td>
|
||||||
<h4 class="box-title">Tanggal : {{today_date}}</h4>
|
|
||||||
<div class="card-content">
|
|
||||||
<table id="example" class="table table-striped table-bordered display" style="width:100%">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<td><b>Nama</b></td>
|
|
||||||
<td><b>Jam Masuk</b></td>
|
|
||||||
<td><b>Jam Keluar</b></td>
|
|
||||||
|
|
||||||
</tr>
|
<td>
|
||||||
</thead>
|
<!-- create a button to print slip gaji -->
|
||||||
<tbody>
|
<button type="button" class="btn btn-xs btn-primary"
|
||||||
{%if data %}
|
onclick="printDiv(`{{data_karyawan[i]['name']}}`,`{{data_karyawan[i]['gaji']}}`,`{{data_karyawan[i]['pendapatan']}}`)">Print
|
||||||
|
Slip Gaji</button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{% endfor %} {% else %}
|
||||||
|
<tr>
|
||||||
|
<td colspan="3" class="text-center">Tidak ada data</td>
|
||||||
|
</tr>
|
||||||
|
{% endif %}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-xs-2 col-md-2"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
{% for i in range(0, length) %}
|
<footer class="footer">
|
||||||
|
<ul class="list-inline">
|
||||||
<tr>
|
<li>2024 ©CV.TIRTA RAHMAN PAREPARE.</li>
|
||||||
<td>{{data[i]['name']}}</td>
|
<!-- <li><a href="#">Privacy</a></li>
|
||||||
<!-- if jam keluar doesn't exist , then show "-" -->
|
|
||||||
{% if data[i]['jam_keluar'] %}
|
|
||||||
<td>{{data[i]['jam_masuk']}}</td>
|
|
||||||
<td>{{data[i]['jam_keluar']}}</td>
|
|
||||||
{% else %}
|
|
||||||
<td>{{data[i]['jam_masuk']}}</td>
|
|
||||||
<td>-</td>
|
|
||||||
{% endif %}
|
|
||||||
</tr>
|
|
||||||
{% endfor %}
|
|
||||||
{% else %}
|
|
||||||
<tr>
|
|
||||||
<td colspan="3" class="text-center">Tidak ada data</td>
|
|
||||||
</tr>
|
|
||||||
{% endif %}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-2 col-md-2"></div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row small-spacing">
|
|
||||||
<div class="col-xs-2 col-md-2"></div>
|
|
||||||
<div class="col-xs-8 col-md-8">
|
|
||||||
<div class="box-content card">
|
|
||||||
<h4 class="box-title">Bulan/Tahun : {{bulan_ini}}</h4>
|
|
||||||
<div class="card-content">
|
|
||||||
<table id="example" class="table table-striped table-bordered display" style="width:100%">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<td><b>Nama</b></td>
|
|
||||||
<td><b>Gaji/Hari</b></td>
|
|
||||||
<td><b>Pendapatan/Bulan</b></td>
|
|
||||||
<td><b>Aksi</b></td>
|
|
||||||
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
{%if data_karyawan %}
|
|
||||||
|
|
||||||
{% for i in range(0, length_karyawan) %}
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{{data_karyawan[i]['name']}}</td>
|
|
||||||
<td class="gajinya">{{data_karyawan[i]['gaji']}}</td>
|
|
||||||
<td class="gajinya">{{data_karyawan[i]['pendapatan']}}</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<!-- create a button to print slip gaji -->
|
|
||||||
<button type="button" class="btn btn-xs btn-primary"
|
|
||||||
onclick="printDiv(`{{data_karyawan[i]['name']}}`,`{{data_karyawan[i]['gaji']}}`,`{{data_karyawan[i]['pendapatan']}}`)">Print
|
|
||||||
Slip Gaji</button>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
|
|
||||||
</tr>
|
|
||||||
{% endfor %}
|
|
||||||
{% else %}
|
|
||||||
<tr>
|
|
||||||
<td colspan="3" class="text-center">Tidak ada data</td>
|
|
||||||
</tr>
|
|
||||||
{% endif %}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-2 col-md-2"></div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<footer class="footer">
|
|
||||||
<ul class="list-inline">
|
|
||||||
<li>2023 © Naufal.</li>
|
|
||||||
<!-- <li><a href="#">Privacy</a></li>
|
|
||||||
<li><a href="#">Terms</a></li>
|
<li><a href="#">Terms</a></li>
|
||||||
<li><a href="#">Help</a></li> -->
|
<li><a href="#">Help</a></li> -->
|
||||||
</ul>
|
</ul>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
<!-- /.main-content -->
|
<!-- /.main-content -->
|
||||||
</div><!--/#wrapper -->
|
</div>
|
||||||
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
<!--/#wrapper -->
|
||||||
<!--[if lt IE 9]>
|
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
||||||
<script src="assets/script/html5shiv.min.js"></script>
|
<!--[if lt IE 9]>
|
||||||
<script src="assets/script/respond.min.js"></script>
|
<script src="assets/script/html5shiv.min.js"></script>
|
||||||
<![endif]-->
|
<script src="assets/script/respond.min.js"></script>
|
||||||
<!--
|
<![endif]-->
|
||||||
|
<!--
|
||||||
================================================== -->
|
================================================== -->
|
||||||
<!-- Placed at the end of the document so the pages load faster -->
|
<!-- Placed at the end of the document so the pages load faster -->
|
||||||
<script src="assets/scripts/jquery.min.js"></script>
|
<script src="assets/scripts/jquery.min.js"></script>
|
||||||
<script src="assets/scripts/modernizr.min.js"></script>
|
<script src="assets/scripts/modernizr.min.js"></script>
|
||||||
<script src="assets/plugin/bootstrap/js/bootstrap.min.js"></script>
|
<script src="assets/plugin/bootstrap/js/bootstrap.min.js"></script>
|
||||||
<script src="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
|
<script src="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
|
||||||
<script src="assets/plugin/nprogress/nprogress.js"></script>
|
<script src="assets/plugin/nprogress/nprogress.js"></script>
|
||||||
<script src="assets/plugin/sweet-alert/sweetalert.min.js"></script>
|
<script src="assets/plugin/sweet-alert/sweetalert.min.js"></script>
|
||||||
<script src="assets/plugin/waves/waves.min.js"></script>
|
<script src="assets/plugin/waves/waves.min.js"></script>
|
||||||
<!-- Full Screen Plugin -->
|
<!-- Full Screen Plugin -->
|
||||||
<script src="assets/plugin/fullscreen/jquery.fullscreen-min.js"></script>
|
<script src="assets/plugin/fullscreen/jquery.fullscreen-min.js"></script>
|
||||||
|
|
||||||
<!-- Data Tables -->
|
<!-- Data Tables -->
|
||||||
<script src="assets/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
|
<script src="assets/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
|
||||||
<script src="assets/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
|
<script src="assets/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
|
||||||
|
|
||||||
<script src="assets/scripts/main.min.js"></script>
|
<script src="assets/scripts/main.min.js"></script>
|
||||||
<script>
|
<script>
|
||||||
function goto(stat) {
|
function goto(stat) {
|
||||||
if (stat == 'home') {
|
if (stat == "home") {
|
||||||
window.location.href = "{{url_for('home')}}";
|
window.location.href = "{{url_for('home')}}";
|
||||||
} else if (stat == 'tambah_karyawan') {
|
} else if (stat == "tambah_karyawan") {
|
||||||
window.location.href = "{{url_for('tambah_karyawan')}}";
|
window.location.href = "{{url_for('tambah_karyawan')}}";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// create a function that addn thousand separator using comma
|
// create a function that addn thousand separator using comma
|
||||||
function addThousandSeparator(number) {
|
function addThousandSeparator(number) {
|
||||||
// Convert the number to a string
|
// Convert the number to a string
|
||||||
let numStr = number.toString();
|
let numStr = number.toString();
|
||||||
|
|
||||||
// Use a regular expression to add commas as thousand separators
|
// Use a regular expression to add commas as thousand separators
|
||||||
numStr = numStr.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
numStr = numStr.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
||||||
|
|
||||||
return numStr;
|
return numStr;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Get all <td> elements with the class "ini dia"
|
// Get all <td> elements with the class "ini dia"
|
||||||
const tdElements = document.querySelectorAll('td.gajinya');
|
const tdElements = document.querySelectorAll("td.gajinya");
|
||||||
|
|
||||||
// Iterate through each <td> element
|
// Iterate through each <td> element
|
||||||
tdElements.forEach(td => {
|
tdElements.forEach((td) => {
|
||||||
// Get the current value of the <td>
|
// Get the current value of the <td>
|
||||||
let currentValue = parseFloat(td.textContent);
|
let currentValue = parseFloat(td.textContent);
|
||||||
|
|
||||||
// Check if the value is a valid number
|
// Check if the value is a valid number
|
||||||
if (!isNaN(currentValue)) {
|
if (!isNaN(currentValue)) {
|
||||||
// Update the content of the <td> with the formatted value
|
// Update the content of the <td> with the formatted value
|
||||||
td.textContent = 'Rp. ' + addThousandSeparator(currentValue);
|
td.textContent = "Rp. " + addThousandSeparator(currentValue);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function addThousandSeparators(value) {
|
||||||
|
return value.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
||||||
|
}
|
||||||
|
|
||||||
function addThousandSeparators(value) {
|
function printDiv(name, gaji, pendapatan) {
|
||||||
return value.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
var this_month = getMonthName(new Date().getMonth()); // Get the current month name
|
||||||
}
|
var printWindow = window.open("", "", "height=600,width=400");
|
||||||
|
printWindow.document.write("<html><head><title>Slip Gaji Bulan " + this_month + "</title>");
|
||||||
|
printWindow.document.write("<style>");
|
||||||
function printDiv(name, gaji, pendapatan) {
|
printWindow.document.write("body { font-family: Arial, sans-serif; }");
|
||||||
console.log(name, gaji, pendapatan);
|
printWindow.document.write(".header { text-align: center; margin-bottom: 20px; }");
|
||||||
var printWindow = window.open('', '', 'height=400,width=800');
|
printWindow.document.write(".line { border-top: 2px solid #000; margin-bottom: 20px; }");
|
||||||
printWindow.document.write('<html><head><title>DIV Contents</title>');
|
printWindow.document.write(".content { display: flex; align-items: flex-start; margin-bottom: 20px; }");
|
||||||
printWindow.document.write('</head><body >');
|
printWindow.document.write(".content img { width: 110px; height: 160px; margin-right: 20px; }");
|
||||||
printWindow.document.write('<h1>Slip Gaji</h1>');
|
printWindow.document.write(".footer { display: flex; justify-content: space-between; margin-top: 20px; }");
|
||||||
printWindow.document.write('<p>Nama : ' + name + '</p>');
|
printWindow.document.write(".footer p { margin: 0; }");
|
||||||
printWindow.document.write('<p>Gaji : Rp.' + addThousandSeparator(gaji) + '</p>');
|
printWindow.document.write(".signature { margin-top: 40px; text-align: right; }");
|
||||||
printWindow.document.write('<p>Pendapatan : Rp. ' + addThousandSeparator(pendapatan) + '</p>');
|
printWindow.document.write("</style>");
|
||||||
printWindow.document.write('<p>Tanggal : {{today_date}}</p>');
|
printWindow.document.write("</head><body>");
|
||||||
printWindow.document.write('<p>Terima kasih atas kerja keras anda</p>');
|
printWindow.document.write("<div class='header'><h1>Slip Gaji Bulan " + this_month + "</h1></div>");
|
||||||
// ttd
|
printWindow.document.write("<div class='line'></div>");
|
||||||
printWindow.document.write('<br><br><br><br>');
|
printWindow.document.write("<div class='content'>");
|
||||||
printWindow.document.write('<p>TTD</p>');
|
printWindow.document.write("<img src='https://absensi_karyawan.kicap-karan.com/faces/" + name + ".jpg' alt='Foto Karyawan'>");
|
||||||
printWindow.document.write('<p>Naufal</p>');
|
printWindow.document.write("<div>");
|
||||||
|
printWindow.document.write("<p>Nama: " + name + "</p>");
|
||||||
|
printWindow.document.write("<p>Gaji: Rp." + addThousandSeparator(gaji) + "</p>");
|
||||||
printWindow.document.write('</body></html>');
|
printWindow.document.write("<p>Pendapatan: Rp. " + addThousandSeparator(pendapatan) + "</p>");
|
||||||
printWindow.document.close();
|
printWindow.document.write("<p>Tanggal: {{today_date}}</p>");
|
||||||
printWindow.print();
|
printWindow.document.write("</div>");
|
||||||
}
|
printWindow.document.write("</div>");
|
||||||
</script>
|
printWindow.document.write("<p>Terima kasih atas kerja keras Anda</p>");
|
||||||
|
printWindow.document.write("<div class='line'></div>");
|
||||||
|
printWindow.document.write("<br><br><br><br>");
|
||||||
|
printWindow.document.write("<div class='footer'>");
|
||||||
|
printWindow.document.write("<div class='left-signature'>");
|
||||||
|
printWindow.document.write("<hr>");
|
||||||
|
printWindow.document.write("<p>Tanda Tangan " + name + "</p>");
|
||||||
|
printWindow.document.write("</div>");
|
||||||
|
printWindow.document.write("<div class='right-signature'>");
|
||||||
|
printWindow.document.write("<hr>");
|
||||||
|
printWindow.document.write("<p>Tanda Tangan Pimpinan</p>");
|
||||||
|
printWindow.document.write("</div>");
|
||||||
|
printWindow.document.write("</div>");
|
||||||
|
printWindow.document.write("</body></html>");
|
||||||
|
printWindow.document.close();
|
||||||
|
printWindow.print();
|
||||||
|
}
|
||||||
|
|
||||||
|
function getMonthName(month) {
|
||||||
|
var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
|
||||||
|
return months[month];
|
||||||
|
}
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -1,84 +1,78 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||||
|
<meta name="description" content="" />
|
||||||
|
<meta name="author" content="" />
|
||||||
|
|
||||||
<head>
|
<title>Sistem Absensi - Halaman Scan</title>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
||||||
<meta name="description" content="">
|
|
||||||
<meta name="author" content="">
|
|
||||||
|
|
||||||
<title>Sistem Absensi - Halaman Utama</title>
|
|
||||||
|
|
||||||
<!-- Main Styles -->
|
<!-- Main Styles -->
|
||||||
<link rel="stylesheet" href="assets/styles/style-horizontal.min.css">
|
<link rel="stylesheet" href="assets/styles/style-horizontal.min.css" />
|
||||||
|
|
||||||
<!-- mCustomScrollbar -->
|
<!-- mCustomScrollbar -->
|
||||||
<link rel="stylesheet" href="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
|
<link rel="stylesheet" href="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css" />
|
||||||
|
|
||||||
<!-- Waves Effect -->
|
<!-- Waves Effect -->
|
||||||
<link rel="stylesheet" href="assets/plugin/waves/waves.min.css">
|
<link rel="stylesheet" href="assets/plugin/waves/waves.min.css" />
|
||||||
|
|
||||||
<!-- Sweet Alert -->
|
<!-- Sweet Alert -->
|
||||||
<link rel="stylesheet" href="assets/plugin/sweet-alert/sweetalert.css">
|
<link rel="stylesheet" href="assets/plugin/sweet-alert/sweetalert.css" />
|
||||||
|
|
||||||
<!-- Color Picker -->
|
<!-- Color Picker -->
|
||||||
<link rel="stylesheet" href="assets/color-switcher/color-switcher.min.css">
|
<link rel="stylesheet" href="assets/color-switcher/color-switcher.min.css" />
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="fixed-header">
|
<header class="fixed-header">
|
||||||
<div class="header-top">
|
<div class="header-top">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="pull-left">
|
<div class="pull-left">
|
||||||
<a href="" class="logo">Sistem Absensi</a>
|
<a href="" class="logo">Sistem Absensi</a>
|
||||||
</div>
|
</div>
|
||||||
<!-- /.pull-left -->
|
<!-- /.pull-left -->
|
||||||
|
|
||||||
<!-- /.pull-right -->
|
<!-- /.pull-right -->
|
||||||
</div>
|
|
||||||
<!-- /.container -->
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.header-top -->
|
<!-- /.container -->
|
||||||
|
</div>
|
||||||
|
<!-- /.header-top -->
|
||||||
|
|
||||||
<!-- /.nav-horizontal -->
|
<!-- /.nav-horizontal -->
|
||||||
</header>
|
</header>
|
||||||
<!-- /.fixed-header -->
|
<!-- /.fixed-header -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div id="wrapper">
|
<div id="wrapper">
|
||||||
<div class="main-content container">
|
<div class="main-content container">
|
||||||
<div class="row small-spacing">
|
<div class="row small-spacing">
|
||||||
<div class="col-lg-4 col-md-4 col-xs-12">
|
<div class="col-lg-4 col-md-4 col-xs-12">
|
||||||
<div class="box-content bg-warning text-white">
|
<div class="box-content bg-warning text-white">
|
||||||
<h4 class="box-title">Loading...</h4>
|
<h4 class="box-title">Loading...</h4>
|
||||||
|
|
||||||
</div>
|
|
||||||
<!-- /.box-content -->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- create a button on center of this -->
|
<!-- /.box-content -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- create a button on center of this -->
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<ul class="list-inline">
|
||||||
<footer class="footer">
|
<li>2023 © Naufal.</li>
|
||||||
<ul class="list-inline">
|
<!-- <li><a href="#">Privacy</a></li>
|
||||||
<li>2023 © Naufal.</li>
|
|
||||||
<!-- <li><a href="#">Privacy</a></li>
|
|
||||||
<li><a href="#">Terms</a></li>
|
<li><a href="#">Terms</a></li>
|
||||||
<li><a href="#">Help</a></li> -->
|
<li><a href="#">Help</a></li> -->
|
||||||
</ul>
|
</ul>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
<!-- /.main-content -->
|
<!-- /.main-content -->
|
||||||
</div><!--/#wrapper -->
|
</div>
|
||||||
|
<!--/#wrapper -->
|
||||||
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
||||||
<!--[if lt IE 9]>
|
<!--[if lt IE 9]>
|
||||||
<script src="assets/script/html5shiv.min.js"></script>
|
<script src="assets/script/html5shiv.min.js"></script>
|
||||||
<script src="assets/script/respond.min.js"></script>
|
<script src="assets/script/respond.min.js"></script>
|
||||||
<![endif]-->
|
<![endif]-->
|
||||||
<!--
|
<!--
|
||||||
================================================== -->
|
================================================== -->
|
||||||
<!-- Placed at the end of the document so the pages load faster -->
|
<!-- Placed at the end of the document so the pages load faster -->
|
||||||
|
|
@ -95,43 +89,41 @@
|
||||||
<script src="assets/scripts/main.min.js"></script>
|
<script src="assets/scripts/main.min.js"></script>
|
||||||
<script src="assets/block/jquery.blockUI.js"></script>
|
<script src="assets/block/jquery.blockUI.js"></script>
|
||||||
<script>
|
<script>
|
||||||
$.blockUI({
|
$.blockUI({
|
||||||
message: "Sedang Proses Database",
|
message: "Sedang Proses Database",
|
||||||
css: {
|
css: {
|
||||||
border: 'none',
|
border: "none",
|
||||||
padding: '15px',
|
padding: "15px",
|
||||||
backgroundColor: '#000',
|
backgroundColor: "#000",
|
||||||
'-webkit-border-radius': '10px',
|
"-webkit-border-radius": "10px",
|
||||||
'-moz-border-radius': '10px',
|
"-moz-border-radius": "10px",
|
||||||
opacity: .5,
|
opacity: 0.5,
|
||||||
color: '#fff'
|
color: "#fff",
|
||||||
|
},
|
||||||
|
});
|
||||||
|
function checkScanStatus() {
|
||||||
|
// Make an AJAX request to the /scan_status route
|
||||||
|
$.ajax({
|
||||||
|
url: "http://127.0.0.1:5000/scan_status",
|
||||||
|
type: "GET",
|
||||||
|
dataType: "json",
|
||||||
|
success: function (data) {
|
||||||
|
// Handle the response data
|
||||||
|
console.log(data.scan_status);
|
||||||
|
// $("#result").text("Title: " + data.title);
|
||||||
|
if (data.scan_status == false) {
|
||||||
|
window.location.href = "http://127.0.0.1:5000/";
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
error: function (xhr, status, error) {
|
||||||
|
// Handle errors
|
||||||
|
console.log("Error: " + error);
|
||||||
|
},
|
||||||
});
|
});
|
||||||
function checkScanStatus() {
|
}
|
||||||
// Make an AJAX request to the /scan_status route
|
|
||||||
$.ajax({
|
|
||||||
url: "http://127.0.0.1:5000/scan_status",
|
|
||||||
type: "GET",
|
|
||||||
dataType: "json",
|
|
||||||
success: function (data) {
|
|
||||||
// Handle the response data
|
|
||||||
console.log(data.scan_status);
|
|
||||||
// $("#result").text("Title: " + data.title);
|
|
||||||
if(data.scan_status == false){
|
|
||||||
window.location.href = "http://127.0.0.1:5000/";
|
|
||||||
}
|
|
||||||
},
|
|
||||||
error: function (xhr, status, error) {
|
|
||||||
// Handle errors
|
|
||||||
console.log("Error: " + error);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Periodically check the scan status every 2 seconds
|
// Periodically check the scan status every 2 seconds
|
||||||
setInterval(checkScanStatus, 2000);
|
setInterval(checkScanStatus, 2000);
|
||||||
</script>
|
</script>
|
||||||
|
</body>
|
||||||
</body>
|
</html>
|
||||||
|
|
||||||
</html>
|
|
||||||
|
|
|
||||||
|
|
@ -1,264 +1,323 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||||
|
<meta name="description" content="" />
|
||||||
|
<meta name="author" content="" />
|
||||||
|
|
||||||
<head>
|
<title>Sistem Absensi - Halaman Tambah Karyawan</title>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
||||||
<meta name="description" content="">
|
|
||||||
<meta name="author" content="">
|
|
||||||
|
|
||||||
<title>Sistem Absensi - Halaman Tambah Karyawan</title>
|
<!-- Main Styles -->
|
||||||
|
<link rel="stylesheet" href="assets/styles/style-horizontal.min.css" />
|
||||||
|
|
||||||
<!-- Main Styles -->
|
<!-- mCustomScrollbar -->
|
||||||
<link rel="stylesheet" href="assets/styles/style-horizontal.min.css">
|
<link rel="stylesheet" href="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css" />
|
||||||
|
|
||||||
<!-- mCustomScrollbar -->
|
<!-- Waves Effect -->
|
||||||
<link rel="stylesheet" href="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
|
<link rel="stylesheet" href="assets/plugin/waves/waves.min.css" />
|
||||||
|
|
||||||
<!-- Waves Effect -->
|
<!-- Sweet Alert -->
|
||||||
<link rel="stylesheet" href="assets/plugin/waves/waves.min.css">
|
<link rel="stylesheet" href="assets/plugin/sweet-alert/sweetalert.css" />
|
||||||
|
|
||||||
<!-- Sweet Alert -->
|
<!-- Color Picker -->
|
||||||
<link rel="stylesheet" href="assets/plugin/sweet-alert/sweetalert.css">
|
<link rel="stylesheet" href="assets/color-switcher/color-switcher.min.css" />
|
||||||
|
<!-- Data Tables -->
|
||||||
|
<link rel="stylesheet" href="assets/plugin/datatables/media/css/dataTables.bootstrap.min.css" />
|
||||||
|
<link rel="stylesheet" href="assets/plugin/datatables/extensions/Responsive/css/responsive.bootstrap.min.css" />
|
||||||
|
#preview { max-width: 300px; max-height: 300px; margin-top: 20px; }
|
||||||
|
</head>
|
||||||
|
|
||||||
<!-- Color Picker -->
|
<body>
|
||||||
<link rel="stylesheet" href="assets/color-switcher/color-switcher.min.css">
|
<header class="fixed-header">
|
||||||
<!-- Data Tables -->
|
<div class="header-top">
|
||||||
<link rel="stylesheet" href="assets/plugin/datatables/media/css/dataTables.bootstrap.min.css">
|
<div class="container">
|
||||||
<link rel="stylesheet" href="assets/plugin/datatables/extensions/Responsive/css/responsive.bootstrap.min.css">
|
<div class="pull-left">
|
||||||
</head>
|
<a href="" class="logo">Sistem Absensi</a>
|
||||||
|
</div>
|
||||||
|
<!-- /.pull-left -->
|
||||||
|
|
||||||
<body>
|
<!-- /.pull-right -->
|
||||||
<header class="fixed-header">
|
</div>
|
||||||
<div class="header-top">
|
<!-- /.container -->
|
||||||
<div class="container">
|
</div>
|
||||||
<div class="pull-left">
|
<!-- /.header-top -->
|
||||||
<a href="" class="logo">Sistem Absensi</a>
|
|
||||||
</div>
|
|
||||||
<!-- /.pull-left -->
|
|
||||||
|
|
||||||
<!-- /.pull-right -->
|
<!-- /.nav-horizontal -->
|
||||||
</div>
|
</header>
|
||||||
<!-- /.container -->
|
<!-- /.fixed-header -->
|
||||||
</div>
|
|
||||||
<!-- /.header-top -->
|
|
||||||
|
|
||||||
<!-- /.nav-horizontal -->
|
<div id="wrapper">
|
||||||
</header>
|
<div class="main-content container">
|
||||||
<!-- /.fixed-header -->
|
<!-- <div class="row small-spacing">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div id="wrapper">
|
|
||||||
<div class="main-content container">
|
|
||||||
<div class="row small-spacing">
|
|
||||||
<div class="col-lg-4 col-md-4 col-xs-6">
|
<div class="col-lg-4 col-md-4 col-xs-6">
|
||||||
<div class="box-content bg-success text-white" style="background :grey;cursor: pointer;"
|
<div class="box-content bg-success text-white" style="background :grey;cursor: pointer;"
|
||||||
onclick="goto('home')">
|
onclick="goto('home')">
|
||||||
<h4 class="box-title">Halaman Utama</h4>
|
<h4 class="box-title">Halaman Utama</h4>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.box-content -->
|
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-4 col-md-4 col-xs-6">
|
<div class="col-lg-4 col-md-4 col-xs-6">
|
||||||
<div class="box-content bg-info text-white" style="background :grey;cursor: pointer"
|
<div class="box-content bg-info text-white" style="background :grey;cursor: pointer"
|
||||||
onclick="goto('tambah_karyawan')"">
|
onclick="goto('tambah_karyawan')">
|
||||||
<h4 class=" box-title">Tambah Data Karyawan</h4>
|
<h4 class=" box-title">Tambah Data Karyawan</h4>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.box-content -->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
<!-- create a button on center of this -->
|
<!-- create a button on center of this -->
|
||||||
<div class="row small-spacing">
|
<div class="row small-spacing">
|
||||||
<div class="col-lg-4 col-md-4 col-xs-2"></div>
|
<div class="col-lg-2 col-md-2 col-xs-2"></div>
|
||||||
<div class="col-lg-4 col-md-4 col-xs-8">
|
<div class="col-lg-8 col-md-8 col-xs-8">
|
||||||
<div class="box-content ">
|
<div class="box-content">
|
||||||
<h4 class="box-title">Informasi Karyawan</h4>
|
<h4 class="box-title">Informasi Karyawan</h4>
|
||||||
<div class="card-content">
|
<div class="card-content">
|
||||||
<form>
|
<form>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="nik">Nomor Induk Karyawan</label>
|
<label for="nik">Nomor Induk Karyawan</label>
|
||||||
<input type="text" class="form-control" id="nik" name="nik"
|
<input type="text" class="form-control" id="nik" name="nik" placeholder="Masukkan Nomor Induk Karyawan" />
|
||||||
placeholder="Masukkan Nomor Induk Karyawan">
|
</div>
|
||||||
</div>
|
<div class="form-group">
|
||||||
<div class="form-group">
|
<label for="nik">Nama Karyawan</label>
|
||||||
<label for="nik">Nama Karyawan</label>
|
<input type="text" class="form-control" id="nama" name="nama" placeholder="Masukkan Nama Karyawan" />
|
||||||
<input type="text" class="form-control" id="nama" name="nama"
|
</div>
|
||||||
placeholder="Masukkan Nama Karyawan">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="nik">Gaji Karyawan / Hari</label>
|
<label for="nik">Gaji Karyawan / Hari</label>
|
||||||
<input type="text" class="form-control" id="gaji" name="gaji"
|
<input
|
||||||
oninput="this.value = this.value.replace(/[^0-9]/g, '').replace(/\B(?=(\d{3})+(?!\d))/g, ',');"
|
type="text"
|
||||||
placeholder="Masukkan Gaji/Hari Karyawan" minlength="6" maxlength="7">
|
class="form-control"
|
||||||
</div>
|
id="gaji"
|
||||||
|
name="gaji"
|
||||||
|
oninput="this.value = this.value.replace(/[^0-9]/g, '').replace(/\B(?=(\d{3})+(?!\d))/g, ',');"
|
||||||
|
placeholder="Masukkan Gaji/Hari Karyawan"
|
||||||
|
minlength="6"
|
||||||
|
maxlength="7"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="form-group text-center">
|
<div class="form-group">
|
||||||
<button type="button" onclick="tambah_data()"
|
<label for="nik">Foto Karyawan</label>
|
||||||
class="btn btn-primary btn-sm waves-effect waves-light">
|
<input type="file" class="form-control" id="fileInput" name="fileInput" accept="image/*" onchange="previewImage(event)" />
|
||||||
Submit
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4 col-md-4 col-xs-2"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row small-spacing">
|
<!-- <div id="imageDisplay"></div> -->
|
||||||
<div class="col-xs-2 col-md-2"></div>
|
</div>
|
||||||
<div class="col-xs-8 col-md-8">
|
<div class="form-group" id="div-preview" style="display: none">
|
||||||
<div class="box-content card">
|
<center>
|
||||||
<h4 class="box-title">Jumlah Karyawan : {{length}} Orang</h4>
|
<div id="preview" style="height: 250px; width: 150px"></div>
|
||||||
<div class="card-content">
|
</center>
|
||||||
<table id="example" class="table table-striped table-bordered display" style="width:100%">
|
</div>
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<td><b>No</b></td>
|
|
||||||
<td><b>NIK</b></td>
|
|
||||||
<td><b>Nama</b></td>
|
|
||||||
<td><b>Gaji/Hari</b></td>
|
|
||||||
|
|
||||||
</tr>
|
<div class="form-group text-center">
|
||||||
</thead>
|
<button type="button" onclick="tambah_data()" class="btn btn-primary btn-sm waves-effect waves-light">Submit</button>
|
||||||
<tbody>
|
</div>
|
||||||
{%if data %}
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-2 col-md-2 col-xs-2"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
{% for i in range(0, length) %}
|
<div class="row small-spacing">
|
||||||
|
<div class="col-xs-2 col-md-2"></div>
|
||||||
|
<div class="col-xs-8 col-md-8">
|
||||||
|
<div class="box-content card">
|
||||||
|
<h4 class="box-title">Jumlah Karyawan : {{length}} Orang</h4>
|
||||||
|
<div class="card-content">
|
||||||
|
<table id="example" class="table table-striped table-bordered display" style="width: 100%">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<td><b>No</b></td>
|
||||||
|
<td><b>NIK</b></td>
|
||||||
|
<td><b>Nama</b></td>
|
||||||
|
<td><b>Gaji/Hari</b></td>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{%if data %} {% for i in range(0, length) %}
|
||||||
|
|
||||||
<tr>
|
<tr>
|
||||||
<td>{{i+1}}</td>
|
<td>{{i+1}}</td>
|
||||||
<td>{{data[i]['nik']}}</td>
|
<td>{{data[i]['nik']}}</td>
|
||||||
<td>{{data[i]['name']}}</td>
|
<td>{{data[i]['name']}}</td>
|
||||||
<td class="gajinya">{{data[i]['gaji']}}</td>
|
<td class="gajinya">{{data[i]['gaji']}}</td>
|
||||||
</tr>
|
</tr>
|
||||||
{% endfor %}
|
{% endfor %} {% endif %}
|
||||||
{% endif %}
|
</tbody>
|
||||||
</tbody>
|
</table>
|
||||||
</table>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-xs-2 col-md-2"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
<footer class="footer">
|
||||||
</div>
|
<ul class="list-inline">
|
||||||
</div>
|
<li>2024 © CV.TIRTA RAHMAN PAREPARE.</li>
|
||||||
<div class="col-xs-2 col-md-2"></div>
|
<!-- <li><a href="#">Privacy</a></li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<footer class="footer">
|
|
||||||
<ul class="list-inline">
|
|
||||||
<li>2023 © Naufal.</li>
|
|
||||||
<!-- <li><a href="#">Privacy</a></li>
|
|
||||||
<li><a href="#">Terms</a></li>
|
<li><a href="#">Terms</a></li>
|
||||||
<li><a href="#">Help</a></li> -->
|
<li><a href="#">Help</a></li> -->
|
||||||
</ul>
|
</ul>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
<!-- /.main-content -->
|
<!-- /.main-content -->
|
||||||
</div><!--/#wrapper -->
|
</div>
|
||||||
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
<!--/#wrapper -->
|
||||||
<!--[if lt IE 9]>
|
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
||||||
<script src="assets/script/html5shiv.min.js"></script>
|
<!--[if lt IE 9]>
|
||||||
<script src="assets/script/respond.min.js"></script>
|
<script src="assets/script/html5shiv.min.js"></script>
|
||||||
<![endif]-->
|
<script src="assets/script/respond.min.js"></script>
|
||||||
<!--
|
<![endif]-->
|
||||||
|
<!--
|
||||||
================================================== -->
|
================================================== -->
|
||||||
<!-- Placed at the end of the document so the pages load faster -->
|
<!-- Placed at the end of the document so the pages load faster -->
|
||||||
<script src="assets/scripts/jquery.min.js"></script>
|
<script src="assets/scripts/jquery.min.js"></script>
|
||||||
<script src="assets/scripts/modernizr.min.js"></script>
|
<script src="assets/scripts/modernizr.min.js"></script>
|
||||||
<script src="assets/plugin/bootstrap/js/bootstrap.min.js"></script>
|
<script src="assets/plugin/bootstrap/js/bootstrap.min.js"></script>
|
||||||
<script src="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
|
<script src="assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
|
||||||
<script src="assets/plugin/nprogress/nprogress.js"></script>
|
<script src="assets/plugin/nprogress/nprogress.js"></script>
|
||||||
<script src="assets/plugin/sweet-alert/sweetalert.min.js"></script>
|
<script src="assets/plugin/sweet-alert/sweetalert.min.js"></script>
|
||||||
<script src="assets/plugin/waves/waves.min.js"></script>
|
<script src="assets/plugin/waves/waves.min.js"></script>
|
||||||
<!-- Full Screen Plugin -->
|
<!-- Full Screen Plugin -->
|
||||||
<script src="assets/plugin/fullscreen/jquery.fullscreen-min.js"></script>
|
<script src="assets/plugin/fullscreen/jquery.fullscreen-min.js"></script>
|
||||||
|
|
||||||
<!-- Data Tables -->
|
<!-- Data Tables -->
|
||||||
<script src="assets/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
|
<script src="assets/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
|
||||||
<script src="assets/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
|
<script src="assets/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
|
||||||
|
|
||||||
<script src="assets/scripts/main.min.js"></script>
|
<script src="assets/scripts/main.min.js"></script>
|
||||||
<script>
|
<script>
|
||||||
function goto(stat) {
|
function previewImage(event) {
|
||||||
if (stat == 'home') {
|
var file = event.target.files[0];
|
||||||
window.location.href = "{{url_for('home')}}";
|
|
||||||
} else if (stat == 'tambah_karyawan') {
|
|
||||||
window.location.href = "{{url_for('tambah_karyawan')}}";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function tambah_data() {
|
// Check if the file is an image
|
||||||
|
if (file && file.type.startsWith("image/")) {
|
||||||
|
var reader = new FileReader();
|
||||||
|
|
||||||
var nik = $('#nik').val();
|
reader.onload = function () {
|
||||||
var nama = $('#nama').val();
|
var imgElement = document.createElement("img");
|
||||||
var gaji = $('#gaji').val();
|
imgElement.setAttribute("src", reader.result);
|
||||||
if (nik == '' || nama == '' || gaji == '') {
|
imgElement.setAttribute("alt", "Preview Image");
|
||||||
swal({
|
|
||||||
title: "Gagal",
|
|
||||||
text: "Data tidak boleh kosong",
|
|
||||||
type: "error",
|
|
||||||
confirmButtonClass: "btn-danger",
|
|
||||||
confirmButtonText: "Ok",
|
|
||||||
closeOnConfirm: false
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// remove comma from gaji
|
|
||||||
gaji = gaji.replace(/,/g, '');
|
|
||||||
$.ajax({
|
|
||||||
url: "http://127.0.0.1:5000/tambah_karyawan",
|
|
||||||
type: "POST",
|
|
||||||
data: {
|
|
||||||
nik: nik,
|
|
||||||
nama: nama,
|
|
||||||
gaji: gaji
|
|
||||||
},
|
|
||||||
success: function (data) {
|
|
||||||
// console.log(data)
|
|
||||||
window.location.href = "{{url_for('scan_face2')}}";
|
|
||||||
},
|
|
||||||
error: function (jqXhr, textStatus, errorThrown) {
|
|
||||||
console.log(errorThrown);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// create a function that addn thousand separator using comma
|
var previewDiv = document.getElementById("preview");
|
||||||
function addThousandSeparator(number) {
|
previewDiv.innerHTML = "";
|
||||||
// Convert the number to a string
|
previewDiv.appendChild(imgElement);
|
||||||
let numStr = number.toString();
|
document.getElementById("div-preview").style.display = "block";
|
||||||
|
document.getElementById("preview").style.display = "block";
|
||||||
|
|
||||||
// Use a regular expression to add commas as thousand separators
|
// // Display the image in a separate div
|
||||||
numStr = numStr.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
// var imageDisplayDiv = document.getElementById('imageDisplay');
|
||||||
|
// imageDisplayDiv.innerHTML = '';
|
||||||
|
// var imgClone = imgElement.cloneNode(true);
|
||||||
|
// imageDisplayDiv.appendChild(imgClone);
|
||||||
|
};
|
||||||
|
|
||||||
return numStr;
|
reader.readAsDataURL(file);
|
||||||
}
|
} else {
|
||||||
|
alert("Please select an image file.");
|
||||||
|
document.getElementById("fileInput").value = ""; // Clear the input
|
||||||
|
document.getElementById("preview").innerHTML = "";
|
||||||
|
document.getElementById("preview").style.display = "none";
|
||||||
|
document.getElementById("div-preview").style.display = "none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Get all <td> elements with the class "ini dia"
|
function goto(stat) {
|
||||||
const tdElements = document.querySelectorAll('td.gajinya');
|
if (stat == "home") {
|
||||||
|
window.location.href = "{{url_for('home')}}";
|
||||||
|
} else if (stat == "tambah_karyawan") {
|
||||||
|
window.location.href = "{{url_for('tambah_karyawan')}}";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Iterate through each <td> element
|
function tambah_data() {
|
||||||
tdElements.forEach(td => {
|
var nik = $("#nik").val();
|
||||||
// Get the current value of the <td>
|
var nama = $("#nama").val();
|
||||||
let currentValue = parseFloat(td.textContent);
|
var gaji = $("#gaji").val();
|
||||||
|
var fileInput = document.getElementById("fileInput");
|
||||||
|
if (nik == "" || nama == "" || gaji == "") {
|
||||||
|
swal({
|
||||||
|
title: "Gagal",
|
||||||
|
text: "Data tidak boleh kosong",
|
||||||
|
type: "error",
|
||||||
|
confirmButtonClass: "btn-danger",
|
||||||
|
confirmButtonText: "Ok",
|
||||||
|
closeOnConfirm: false,
|
||||||
|
});
|
||||||
|
} else if (!fileInput.files || fileInput.files.length === 0) {
|
||||||
|
swal({
|
||||||
|
title: "Gagal",
|
||||||
|
text: "Silakan pilih foto karyawan",
|
||||||
|
type: "error",
|
||||||
|
confirmButtonClass: "btn-danger",
|
||||||
|
confirmButtonText: "Ok",
|
||||||
|
closeOnConfirm: false,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
// remove comma from gaji
|
||||||
|
gaji = gaji.replace(/,/g, "");
|
||||||
|
var file = fileInput.files[0];
|
||||||
|
var formData = new FormData();
|
||||||
|
formData.append("file", file);
|
||||||
|
formData.append("nik", nik);
|
||||||
|
formData.append("nama", nama);
|
||||||
|
formData.append("gaji", gaji);
|
||||||
|
$.ajax({
|
||||||
|
url: "https://absensi_karyawan.kicap-karan.com/tambah_karyawan",
|
||||||
|
type: "POST",
|
||||||
|
data: formData,
|
||||||
|
contentType: false,
|
||||||
|
processData: false,
|
||||||
|
success: function (data) {
|
||||||
|
console.log(data);
|
||||||
|
// window.location.href = "{{url_for('scan_face2')}}";
|
||||||
|
// create swal message
|
||||||
|
swal({
|
||||||
|
title: "Berhasil",
|
||||||
|
text: "Data karyawan berhasil ditambahkan",
|
||||||
|
type: "success",
|
||||||
|
confirmButtonClass: "btn-success",
|
||||||
|
});
|
||||||
|
// delay 1.5 seconds then reload this page
|
||||||
|
setTimeout(function () {
|
||||||
|
window.location.href = "{{url_for('tambah_karyawan')}}";
|
||||||
|
}, 1500);
|
||||||
|
},
|
||||||
|
error: function (jqXhr, textStatus, errorThrown) {
|
||||||
|
console.log(errorThrown);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Check if the value is a valid number
|
// create a function that addn thousand separator using comma
|
||||||
if (!isNaN(currentValue)) {
|
function addThousandSeparator(number) {
|
||||||
// Update the content of the <td> with the formatted value
|
// Convert the number to a string
|
||||||
td.textContent = 'Rp. ' + addThousandSeparator(currentValue);
|
let numStr = number.toString();
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
// Use a regular expression to add commas as thousand separators
|
||||||
|
numStr = numStr.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
||||||
|
|
||||||
</body>
|
return numStr;
|
||||||
|
}
|
||||||
|
|
||||||
</html>
|
// Get all <td> elements with the class "ini dia"
|
||||||
|
const tdElements = document.querySelectorAll("td.gajinya");
|
||||||
|
|
||||||
|
// Iterate through each <td> element
|
||||||
|
tdElements.forEach((td) => {
|
||||||
|
// Get the current value of the <td>
|
||||||
|
let currentValue = parseFloat(td.textContent);
|
||||||
|
|
||||||
|
// Check if the value is a valid number
|
||||||
|
if (!isNaN(currentValue)) {
|
||||||
|
// Update the content of the <td> with the formatted value
|
||||||
|
td.textContent = "Rp. " + addThousandSeparator(currentValue);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue