Update project from local
This commit is contained in:
@@ -1,41 +1,41 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" data-theme="dark">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="google" content="notranslate" />
|
||||
<link rel="shortcut icon" href="/img/templ.png" type="image/png" />
|
||||
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.4.10/dist/full.min.css" rel="stylesheet" type="text/css" />
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="stylesheet" href="/css/styles.css" />
|
||||
<title>Project Structure Demo | Error (404)</title>
|
||||
<script src="https://unpkg.com/htmx.org@1.9.9"
|
||||
integrity="sha384-QFjmbokDn2DjBjq+fM+8LUIVrAgqcNW2s0PjAxHETgRn9l4fvX31ZxDxvwQnyMOX"
|
||||
crossorigin="anonymous"></script>
|
||||
</head>
|
||||
|
||||
<body class="sample-transition" hx-boost="true">
|
||||
<main>
|
||||
<section class="flex flex-col items-center justify-center h-[100vh] gap-4">
|
||||
<div class="items-center justify-center flex flex-col gap-4">
|
||||
<h1 class="text-9xl font-extrabold text-gray-700 tracking-widest">
|
||||
404
|
||||
</h1>
|
||||
<h2 class="bg-rose-700 px-2 text-sm rounded rotate-[20deg] absolute">
|
||||
Resource not found
|
||||
</h2>
|
||||
</div>
|
||||
<p class="text-xs text-center md:text-sm text-gray-400">
|
||||
The requested resource could not be found but may be available again in the future.
|
||||
</p>
|
||||
<a hx-swap="transition:true" href="/user" class="btn btn-secondary btn-outline">
|
||||
Go Home
|
||||
</a>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" data-theme="dark">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="google" content="notranslate" />
|
||||
<link rel="shortcut icon" href="/img/templ.png" type="image/png" />
|
||||
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.4.10/dist/full.min.css" rel="stylesheet" type="text/css" />
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="stylesheet" href="/css/styles.css" />
|
||||
<title>Project Structure Demo | Error (404)</title>
|
||||
<script src="https://unpkg.com/htmx.org@1.9.9"
|
||||
integrity="sha384-QFjmbokDn2DjBjq+fM+8LUIVrAgqcNW2s0PjAxHETgRn9l4fvX31ZxDxvwQnyMOX"
|
||||
crossorigin="anonymous"></script>
|
||||
</head>
|
||||
|
||||
<body class="sample-transition" hx-boost="true">
|
||||
<main>
|
||||
<section class="flex flex-col items-center justify-center h-[100vh] gap-4">
|
||||
<div class="items-center justify-center flex flex-col gap-4">
|
||||
<h1 class="text-9xl font-extrabold text-gray-700 tracking-widest">
|
||||
404
|
||||
</h1>
|
||||
<h2 class="bg-rose-700 px-2 text-sm rounded rotate-[20deg] absolute">
|
||||
Resource not found
|
||||
</h2>
|
||||
</div>
|
||||
<p class="text-xs text-center md:text-sm text-gray-400">
|
||||
The requested resource could not be found but may be available again in the future.
|
||||
</p>
|
||||
<a hx-swap="transition:true" href="/user" class="btn btn-secondary btn-outline">
|
||||
Go Home
|
||||
</a>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -1,34 +1,34 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" data-theme="dark">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="google" content="notranslate" />
|
||||
<link rel="shortcut icon" href="/img/templ.png" type="image/png" />
|
||||
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.4.10/dist/full.min.css" rel="stylesheet" type="text/css" />
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<title>Project Structure Demo | Error (500)</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main>
|
||||
<section class="flex flex-col items-center justify-center h-[100vh] gap-4">
|
||||
<div class="items-center justify-center flex flex-col gap-4">
|
||||
<h1 class="text-9xl font-extrabold text-gray-700 tracking-widest">
|
||||
500
|
||||
</h1>
|
||||
<h2 class="bg-rose-700 px-2 text-sm rounded rotate-[20deg] absolute">
|
||||
Internal Server Error
|
||||
</h2>
|
||||
</div>
|
||||
<p class="text-xs text-center md:text-sm text-gray-400">
|
||||
An unexpected condition was encountered.
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" data-theme="dark">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="google" content="notranslate" />
|
||||
<link rel="shortcut icon" href="/img/templ.png" type="image/png" />
|
||||
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.4.10/dist/full.min.css" rel="stylesheet" type="text/css" />
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<title>Project Structure Demo | Error (500)</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main>
|
||||
<section class="flex flex-col items-center justify-center h-[100vh] gap-4">
|
||||
<div class="items-center justify-center flex flex-col gap-4">
|
||||
<h1 class="text-9xl font-extrabold text-gray-700 tracking-widest">
|
||||
500
|
||||
</h1>
|
||||
<h2 class="bg-rose-700 px-2 text-sm rounded rotate-[20deg] absolute">
|
||||
Internal Server Error
|
||||
</h2>
|
||||
</div>
|
||||
<p class="text-xs text-center md:text-sm text-gray-400">
|
||||
An unexpected condition was encountered.
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_dashboard
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Dashboard", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_dashboard
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Dashboard", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mcupreregister
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client MCU Preregister", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mcupreregister
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client MCU Preregister", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mcusetup
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client MCU Setup", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mcusetup
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client MCU Setup", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdbahan
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Bahan", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdbahan
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Bahan", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdcorp
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Corp", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdcorp
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Corp", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mddokter
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Dokter", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mddokter
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Dokter", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdhargapanel
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Harga Panel", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdhargapanel
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Harga Panel", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdhargaprofile
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Harga Profile", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdhargaprofile
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Harga Profile", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdhargasingle
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Harga Single", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdhargasingle
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Harga Single", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdpaket
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Paket", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdpaket
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Paket", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdpanel
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Panel", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdpanel
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Panel", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdpasien
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Pasien", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdpasien
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Pasien", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdprofile
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Profile", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdprofile
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Profile", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdresultnonlab
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Result Non Lab", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdresultnonlab
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Result Non Lab", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdsamplestation
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Sample Station", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdsamplestation
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Sample Station", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdsampletype
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Sample Type", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdsampletype
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Sample Type", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdtemplatefisik
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Template Fisik", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdtemplatefisik
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Template Fisik", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdtest
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Test", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdtest
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md Test", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mduser
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md User", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mduser
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md User", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_mdusergroup
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md User Group", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_mdusergroup
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Md User Group", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package client_transaksisamplestation
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Transaksi Sample Station", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package client_transaksisamplestation
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Client Transaksi Sample Station", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
package corporate_company
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Corp Company", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
package corporate_company
|
||||
|
||||
import (
|
||||
"cpone/component/under_development"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Content() {
|
||||
<div class="bg-white h-100">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Css() {
|
||||
<style>
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ Js() {
|
||||
}
|
||||
|
||||
templ Show() {
|
||||
@layout.PlaygroundLayout("Corp Company", Css(), Js()) {
|
||||
@Content()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,117 +1,117 @@
|
||||
package corporate_dashboardpic
|
||||
|
||||
import "cpone/layout"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ DashboardPic(
|
||||
listID string,
|
||||
paginationID string,
|
||||
breadcrumb templ.Component,
|
||||
filtercomponent templ.Component,
|
||||
listingcomponent templ.Component,
|
||||
paginationcomponent templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "listID",
|
||||
Name: "listID",
|
||||
Type: "hidden",
|
||||
Value: listID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
@filtercomponent
|
||||
<div id="loading-parent" class="rounded">
|
||||
@listingcomponent
|
||||
@paginationcomponent
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ JSDashboardPIC() {
|
||||
<script>
|
||||
document.body.addEventListener('htmx:configRequest', function(evt) {
|
||||
const token = localStorage.getItem("token");
|
||||
if (token) {
|
||||
evt.detail.headers['Authentication'] = "Bearer " + token;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
templ CSSDashboardPIC() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowDashboardPic(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
package corporate_dashboardpic
|
||||
|
||||
import "cpone/layout"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ DashboardPic(
|
||||
listID string,
|
||||
paginationID string,
|
||||
breadcrumb templ.Component,
|
||||
filtercomponent templ.Component,
|
||||
listingcomponent templ.Component,
|
||||
paginationcomponent templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "listID",
|
||||
Name: "listID",
|
||||
Type: "hidden",
|
||||
Value: listID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
@filtercomponent
|
||||
<div id="loading-parent" class="rounded">
|
||||
@listingcomponent
|
||||
@paginationcomponent
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ JSDashboardPIC() {
|
||||
<script>
|
||||
document.body.addEventListener('htmx:configRequest', function(evt) {
|
||||
const token = localStorage.getItem("token");
|
||||
if (token) {
|
||||
evt.detail.headers['Authentication'] = "Bearer " + token;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
templ CSSDashboardPIC() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowDashboardPic(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
@@ -1,68 +1,68 @@
|
||||
package corporate_dashboardpic
|
||||
|
||||
templ FilterListing(
|
||||
hxGet string,
|
||||
hxTrigger string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
hxTarget string,
|
||||
hxBeforeRequest templ.ComponentScript,
|
||||
hxAfterRequest templ.ComponentScript,
|
||||
) {
|
||||
<div class="row pt-8 align-items-center">
|
||||
<div class="col-12 col-sm-3 col-md-1 col-lg-1 col-xl-1 mb-2">
|
||||
<label class="text-black font-weight-bolder">Start Date:</label>
|
||||
</div>
|
||||
<div class="col-12 col-sm-9 col-md-2 col-lg-2 col-xl-2 mb-2">
|
||||
<input
|
||||
id="startdateID"
|
||||
name="startdate"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="date"
|
||||
autocomplete="off"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3 col-md-1 col-lg-1 col-xl-1 mb-2">
|
||||
<label class="text-black font-weight-bolder">End Date:</label>
|
||||
</div>
|
||||
<div class="col-12 col-sm-9 col-md-2 col-lg-2 col-xl-2 mb-2">
|
||||
<input
|
||||
id="enddateID"
|
||||
name="enddate"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="date"
|
||||
autocomplete="off"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mb-2">
|
||||
<input
|
||||
id="searchID"
|
||||
name="search"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="text"
|
||||
placeholder="Nama MCU"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
package corporate_dashboardpic
|
||||
|
||||
templ FilterListing(
|
||||
hxGet string,
|
||||
hxTrigger string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
hxTarget string,
|
||||
hxBeforeRequest templ.ComponentScript,
|
||||
hxAfterRequest templ.ComponentScript,
|
||||
) {
|
||||
<div class="row pt-8 align-items-center">
|
||||
<div class="col-12 col-sm-3 col-md-1 col-lg-1 col-xl-1 mb-2">
|
||||
<label class="text-black font-weight-bolder">Start Date:</label>
|
||||
</div>
|
||||
<div class="col-12 col-sm-9 col-md-2 col-lg-2 col-xl-2 mb-2">
|
||||
<input
|
||||
id="startdateID"
|
||||
name="startdate"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="date"
|
||||
autocomplete="off"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3 col-md-1 col-lg-1 col-xl-1 mb-2">
|
||||
<label class="text-black font-weight-bolder">End Date:</label>
|
||||
</div>
|
||||
<div class="col-12 col-sm-9 col-md-2 col-lg-2 col-xl-2 mb-2">
|
||||
<input
|
||||
id="enddateID"
|
||||
name="enddate"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="date"
|
||||
autocomplete="off"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mb-2">
|
||||
<input
|
||||
id="searchID"
|
||||
name="search"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="text"
|
||||
placeholder="Nama MCU"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,48 +1,48 @@
|
||||
package corporate_dashboardpic
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ ListingData(
|
||||
data []models.DashboardPic,
|
||||
listID string,
|
||||
) {
|
||||
<div id={listID} class="align-items-center py-8 flex-column" hx-swap-oob="true">
|
||||
if len(data) == 0 {
|
||||
<div class="text-center">
|
||||
<h4>Data Tidak Ditemukan</h4>
|
||||
</div>
|
||||
} else {
|
||||
<div class="bg-field rounded">
|
||||
<div class="p-8">
|
||||
for i, d := range data {
|
||||
if i == (len(data) - 1) {
|
||||
<div id={ strconv.Itoa(int(d.Mgm_McuID)) } class="card shadow p-8" hx-get={"/corp/dashboard_pic/click/" + strconv.Itoa(d.Mgm_McuID)}>
|
||||
@ItemCard(d)
|
||||
</div>
|
||||
} else {
|
||||
<div id={ strconv.Itoa(int(d.Mgm_McuID)) } class="card shadow p-8 mb-8" hx-get={"/corp/dashboard_pic/click/" + strconv.Itoa(d.Mgm_McuID)}>
|
||||
@ItemCard(d)
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemCard(data models.DashboardPic) {
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-7">
|
||||
<h3 class="text-black">{ data.Mgm_McuLabel }</h3>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolder">{ data.Mgm_McuNote }</span>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolder">{ data.Mgm_McuStartDate } - { data.Mgm_McuEndDate }</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
package corporate_dashboardpic
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ ListingData(
|
||||
data []models.DashboardPic,
|
||||
listID string,
|
||||
) {
|
||||
<div id={listID} class="align-items-center py-8 flex-column" hx-swap-oob="true">
|
||||
if len(data) == 0 {
|
||||
<div class="text-center">
|
||||
<h4>Data Tidak Ditemukan</h4>
|
||||
</div>
|
||||
} else {
|
||||
<div class="bg-field rounded">
|
||||
<div class="p-8">
|
||||
for i, d := range data {
|
||||
if i == (len(data) - 1) {
|
||||
<div id={ strconv.Itoa(int(d.Mgm_McuID)) } class="card shadow p-8" hx-get={"/corp/dashboard_pic/click/" + strconv.Itoa(d.Mgm_McuID)}>
|
||||
@ItemCard(d)
|
||||
</div>
|
||||
} else {
|
||||
<div id={ strconv.Itoa(int(d.Mgm_McuID)) } class="card shadow p-8 mb-8" hx-get={"/corp/dashboard_pic/click/" + strconv.Itoa(d.Mgm_McuID)}>
|
||||
@ItemCard(d)
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemCard(data models.DashboardPic) {
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-7">
|
||||
<h3 class="text-black">{ data.Mgm_McuLabel }</h3>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolder">{ data.Mgm_McuNote }</span>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolder">{ data.Mgm_McuStartDate } - { data.Mgm_McuEndDate }</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
|
||||
@@ -1,75 +1,75 @@
|
||||
package corporate_mcudetail
|
||||
|
||||
import "cpone/layout"
|
||||
|
||||
templ McuDetailScreen(
|
||||
breadcrumb templ.Component,
|
||||
content templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSMcuDetail(
|
||||
CssKesimpulan templ.Component,
|
||||
) {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
@CssKesimpulan
|
||||
}
|
||||
|
||||
templ JSMcuDetail() {
|
||||
<script src="assets/js/echarts-js/echart.min.js"></script>
|
||||
}
|
||||
|
||||
templ ShowMcuDetail(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
package corporate_mcudetail
|
||||
|
||||
import "cpone/layout"
|
||||
|
||||
templ McuDetailScreen(
|
||||
breadcrumb templ.Component,
|
||||
content templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSMcuDetail(
|
||||
CssKesimpulan templ.Component,
|
||||
) {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
@CssKesimpulan
|
||||
}
|
||||
|
||||
templ JSMcuDetail() {
|
||||
<script src="assets/js/echarts-js/echart.min.js"></script>
|
||||
}
|
||||
|
||||
templ ShowMcuDetail(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
@@ -1,158 +1,158 @@
|
||||
package corporate_mcudetail
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ McuDetailTabView(
|
||||
McuID string,
|
||||
McuTab []models.McuTabModels,
|
||||
) {
|
||||
<div>
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
for i, d := range McuTab {
|
||||
if i == 0 {
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link active"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(i))}
|
||||
>{ d.TabName }</a>
|
||||
</li>
|
||||
} else {
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(i))}
|
||||
>{ d.TabName }</a>
|
||||
</li>
|
||||
}
|
||||
}
|
||||
<li class="nav-item">
|
||||
<a
|
||||
if len(McuTab) == 0 {
|
||||
class="nav-link active"
|
||||
} else {
|
||||
class="nav-link"
|
||||
}
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(len(McuTab) + 1))}
|
||||
>Kesimpulan</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(len(McuTab) + 2))}
|
||||
>Daftar Peserta</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(len(McuTab) + 3))}
|
||||
>Executive Summary</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(len(McuTab) + 4))}
|
||||
>Keuangan</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="mcutabcontent">
|
||||
for i, d := range McuTab {
|
||||
if i == 0 {
|
||||
<div
|
||||
class="tab-pane fade show active" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(i)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(i)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/" + d.TabID}
|
||||
hx-target={"#" + d.TabID}
|
||||
hx-trigger="load"
|
||||
hx-indicator={"." + d.TabID + d.Mcu_ImageGrafikGroupMenu}
|
||||
>
|
||||
<div id={d.TabID}></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class={"htmx-indicator spinner-border spinner-border-lg " + d.TabID + d.Mcu_ImageGrafikGroupMenu} role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
} else {
|
||||
<div
|
||||
class="tab-pane fade" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(i)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(i)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/" + d.TabID}
|
||||
hx-target={"#" + d.TabID}
|
||||
hx-trigger="load"
|
||||
hx-indicator={"." + d.TabID + d.Mcu_ImageGrafikGroupMenu}
|
||||
>
|
||||
<div id={d.TabID}></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class={"htmx-indicator spinner-border spinner-border-lg " + d.TabID + d.Mcu_ImageGrafikGroupMenu} role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
<div
|
||||
if len(McuTab) == 0 {
|
||||
class="tab-pane fade show active"
|
||||
} else {
|
||||
class="tab-pane fade"
|
||||
}
|
||||
role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(len(McuTab) + 1)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(len(McuTab) + 1)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/tabkesimpulan"}
|
||||
hx-target="#tabkesimpulan"
|
||||
hx-trigger="load"
|
||||
hx-indicator=".kesimpulanloading"
|
||||
>
|
||||
<div id="tabkesimpulan"></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class="htmx-indicator spinner-border spinner-border-lg kesimpulanloading" role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(len(McuTab) + 2)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(len(McuTab) + 2)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/tabdaftarpeserta"}
|
||||
hx-target="#tabdaftarpeserta"
|
||||
hx-trigger="load"
|
||||
hx-indicator=".tabdaftarpesertaload"
|
||||
>
|
||||
<div id="tabdaftarpeserta"></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class="htmx-indicator spinner-border spinner-border-lg tabdaftarpesertaload" role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(len(McuTab) + 3)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(len(McuTab) + 3)}
|
||||
style="height: 700px;"
|
||||
>
|
||||
<object
|
||||
data={"/birt/run?__report=report/one/mcu/rpt_executive_summary_mcu_001.rptdesign&__format=pdf&PID="+McuID+"&username=admin&tm=1722914077866"}
|
||||
type="application/pdf" width="100%" height="100%"
|
||||
></object>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(len(McuTab) + 4)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(len(McuTab) + 4)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/tabkeuangan"}
|
||||
hx-target="#tabkeuangan"
|
||||
hx-trigger="load"
|
||||
hx-indicator=".uangloading"
|
||||
>
|
||||
<div id="tabkeuangan"></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class="htmx-indicator spinner-border spinner-border-lg uangloading" role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
package corporate_mcudetail
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ McuDetailTabView(
|
||||
McuID string,
|
||||
McuTab []models.McuTabModels,
|
||||
) {
|
||||
<div>
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
for i, d := range McuTab {
|
||||
if i == 0 {
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link active"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(i))}
|
||||
>{ d.TabName }</a>
|
||||
</li>
|
||||
} else {
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(i))}
|
||||
>{ d.TabName }</a>
|
||||
</li>
|
||||
}
|
||||
}
|
||||
<li class="nav-item">
|
||||
<a
|
||||
if len(McuTab) == 0 {
|
||||
class="nav-link active"
|
||||
} else {
|
||||
class="nav-link"
|
||||
}
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(len(McuTab) + 1))}
|
||||
>Kesimpulan</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(len(McuTab) + 2))}
|
||||
>Daftar Peserta</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(len(McuTab) + 3))}
|
||||
>Executive Summary</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
data-toggle="tab"
|
||||
href={templ.URL("#mcu_tab_" + strconv.Itoa(len(McuTab) + 4))}
|
||||
>Keuangan</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="mcutabcontent">
|
||||
for i, d := range McuTab {
|
||||
if i == 0 {
|
||||
<div
|
||||
class="tab-pane fade show active" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(i)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(i)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/" + d.TabID}
|
||||
hx-target={"#" + d.TabID}
|
||||
hx-trigger="load"
|
||||
hx-indicator={"." + d.TabID + d.Mcu_ImageGrafikGroupMenu}
|
||||
>
|
||||
<div id={d.TabID}></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class={"htmx-indicator spinner-border spinner-border-lg " + d.TabID + d.Mcu_ImageGrafikGroupMenu} role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
} else {
|
||||
<div
|
||||
class="tab-pane fade" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(i)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(i)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/" + d.TabID}
|
||||
hx-target={"#" + d.TabID}
|
||||
hx-trigger="load"
|
||||
hx-indicator={"." + d.TabID + d.Mcu_ImageGrafikGroupMenu}
|
||||
>
|
||||
<div id={d.TabID}></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class={"htmx-indicator spinner-border spinner-border-lg " + d.TabID + d.Mcu_ImageGrafikGroupMenu} role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
<div
|
||||
if len(McuTab) == 0 {
|
||||
class="tab-pane fade show active"
|
||||
} else {
|
||||
class="tab-pane fade"
|
||||
}
|
||||
role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(len(McuTab) + 1)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(len(McuTab) + 1)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/tabkesimpulan"}
|
||||
hx-target="#tabkesimpulan"
|
||||
hx-trigger="load"
|
||||
hx-indicator=".kesimpulanloading"
|
||||
>
|
||||
<div id="tabkesimpulan"></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class="htmx-indicator spinner-border spinner-border-lg kesimpulanloading" role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(len(McuTab) + 2)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(len(McuTab) + 2)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/tabdaftarpeserta"}
|
||||
hx-target="#tabdaftarpeserta"
|
||||
hx-trigger="load"
|
||||
hx-indicator=".tabdaftarpesertaload"
|
||||
>
|
||||
<div id="tabdaftarpeserta"></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class="htmx-indicator spinner-border spinner-border-lg tabdaftarpesertaload" role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(len(McuTab) + 3)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(len(McuTab) + 3)}
|
||||
style="height: 700px;"
|
||||
>
|
||||
<object
|
||||
data={"/birt/run?__report=report/one/mcu/rpt_executive_summary_mcu_001.rptdesign&__format=pdf&PID="+McuID+"&username=admin&tm=1722914077866"}
|
||||
type="application/pdf" width="100%" height="100%"
|
||||
></object>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade" role="tabpanel"
|
||||
id={"mcu_tab_" + strconv.Itoa(len(McuTab) + 4)}
|
||||
aria-labelledby={"mcu_tab_" + strconv.Itoa(len(McuTab) + 4)}
|
||||
hx-get={"/corp/dashboard_pic/detail/" + McuID +"/tabkeuangan"}
|
||||
hx-target="#tabkeuangan"
|
||||
hx-trigger="load"
|
||||
hx-indicator=".uangloading"
|
||||
>
|
||||
<div id="tabkeuangan"></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class="htmx-indicator spinner-border spinner-border-lg uangloading" role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,17 +1,17 @@
|
||||
package corporate_daftarpeserta
|
||||
|
||||
templ Filter_DaftarPeserta(
|
||||
hx_get string, hx_target string, hx_include string, hx_swap string,
|
||||
hx_trigger string, hx_before templ.ComponentScript, hx_after templ.ComponentScript,
|
||||
) {
|
||||
<div class="row pt-8 align-items-center">
|
||||
<div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 mb-2">
|
||||
<input
|
||||
id="search-daftar-peserta" type="text" placeholder="Cari nama peserta atau NIP"
|
||||
name="searchdp" class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
hx-get={ hx_get } hx-target={ hx_target } hx-include={ hx_include } hx-swap={ hx_swap }
|
||||
hx-trigger={ hx_trigger } hx-on::before-request={ hx_before } hx-on::after-request={ hx_after }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
package corporate_daftarpeserta
|
||||
|
||||
templ Filter_DaftarPeserta(
|
||||
hx_get string, hx_target string, hx_include string, hx_swap string,
|
||||
hx_trigger string, hx_before templ.ComponentScript, hx_after templ.ComponentScript,
|
||||
) {
|
||||
<div class="row pt-8 align-items-center">
|
||||
<div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 mb-2">
|
||||
<input
|
||||
id="search-daftar-peserta" type="text" placeholder="Cari nama peserta atau NIP"
|
||||
name="searchdp" class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
hx-get={ hx_get } hx-target={ hx_target } hx-include={ hx_include } hx-swap={ hx_swap }
|
||||
hx-trigger={ hx_trigger } hx-on::before-request={ hx_before } hx-on::after-request={ hx_after }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,92 +1,92 @@
|
||||
package corporate_daftarpeserta
|
||||
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ Dialog_DaftarPeserta(
|
||||
component_id string, size string,
|
||||
hx_post string, hx_target string, hx_swap string, hx_include string,
|
||||
modal_id string, modal_title string, modal_body templ.Component,
|
||||
modal_close templ.Component, modal_aksi templ.Component,
|
||||
) {
|
||||
<div>
|
||||
<form
|
||||
id={ component_id } class="form"
|
||||
hx-post={ hx_post } hx-target={ hx_target }
|
||||
hx-swap={ hx_swap } hx-inclide={ hx_include } hx-indicator=".formloading"
|
||||
>
|
||||
if size == "xl" {
|
||||
@modalcomponent.ModalXL(modal_id, modal_title, modal_body, modal_aksi, modal_close)
|
||||
} else {
|
||||
@modalcomponent.Modal(modal_id, modal_title, modal_body, modal_aksi, modal_close)
|
||||
}
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_GenPass(component_id string, message string, hx_onload templ.ComponentScript) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
<p>{ message }</p>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_Account(
|
||||
component_id string,
|
||||
acc_id models.CustomTextFieldv2Prm,
|
||||
acc_email models.CustomTextFieldv2Prm,
|
||||
pass models.CustomTextFieldv2Prm,
|
||||
pass_cek models.CustomTextFieldv2Prm,
|
||||
hx_onload templ.ComponentScript,
|
||||
) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
@customtextfield.CustomTextFieldv2(acc_id)
|
||||
@customtextfield.CustomTextFieldv2(acc_email)
|
||||
@customtextfield.CustomTextFieldv2(pass)
|
||||
@customtextfield.CustomTextFieldv2(pass_cek)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_RPT(component_id string, list_rpt templ.Component, hx_onload templ.ComponentScript) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
@list_rpt
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_Detail(component_id string, table_detail templ.Component, hx_onload templ.ComponentScript) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
@table_detail
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_Attachment(component_id string, list_atc templ.Component, hx_onload templ.ComponentScript) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
@list_atc
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Close_Modal(modal_id string) {
|
||||
<button
|
||||
type="button" class="close" data-dismiss="modal"
|
||||
aria-label="Close" hx-on::after-request={ JSHideModal(modal_id) }
|
||||
> <i aria-hidden="true" class="ki ki-close"></i> </button>
|
||||
}
|
||||
|
||||
templ Aksi_Modal(modal_id string, hx_post string, hx_target string, hx_swap string, blank bool) {
|
||||
<div>
|
||||
if !blank {
|
||||
<button
|
||||
type="button" class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btncancel"
|
||||
data-dismiss="modal" hx-indicator=".cancelloading" hx-on::after-request={ JSHideModal(modal_id) }
|
||||
hx-post={ hx_post } hx-target={ hx_target } hx-swap={ hx_swap }
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnsimpan">
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
package corporate_daftarpeserta
|
||||
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ Dialog_DaftarPeserta(
|
||||
component_id string, size string,
|
||||
hx_post string, hx_target string, hx_swap string, hx_include string,
|
||||
modal_id string, modal_title string, modal_body templ.Component,
|
||||
modal_close templ.Component, modal_aksi templ.Component,
|
||||
) {
|
||||
<div>
|
||||
<form
|
||||
id={ component_id } class="form"
|
||||
hx-post={ hx_post } hx-target={ hx_target }
|
||||
hx-swap={ hx_swap } hx-inclide={ hx_include } hx-indicator=".formloading"
|
||||
>
|
||||
if size == "xl" {
|
||||
@modalcomponent.ModalXL(modal_id, modal_title, modal_body, modal_aksi, modal_close)
|
||||
} else {
|
||||
@modalcomponent.Modal(modal_id, modal_title, modal_body, modal_aksi, modal_close)
|
||||
}
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_GenPass(component_id string, message string, hx_onload templ.ComponentScript) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
<p>{ message }</p>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_Account(
|
||||
component_id string,
|
||||
acc_id models.CustomTextFieldv2Prm,
|
||||
acc_email models.CustomTextFieldv2Prm,
|
||||
pass models.CustomTextFieldv2Prm,
|
||||
pass_cek models.CustomTextFieldv2Prm,
|
||||
hx_onload templ.ComponentScript,
|
||||
) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
@customtextfield.CustomTextFieldv2(acc_id)
|
||||
@customtextfield.CustomTextFieldv2(acc_email)
|
||||
@customtextfield.CustomTextFieldv2(pass)
|
||||
@customtextfield.CustomTextFieldv2(pass_cek)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_RPT(component_id string, list_rpt templ.Component, hx_onload templ.ComponentScript) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
@list_rpt
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_Detail(component_id string, table_detail templ.Component, hx_onload templ.ComponentScript) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
@table_detail
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Body_Attachment(component_id string, list_atc templ.Component, hx_onload templ.ComponentScript) {
|
||||
<div id={ component_id } hx-on::load={ hx_onload }>
|
||||
@list_atc
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Close_Modal(modal_id string) {
|
||||
<button
|
||||
type="button" class="close" data-dismiss="modal"
|
||||
aria-label="Close" hx-on::after-request={ JSHideModal(modal_id) }
|
||||
> <i aria-hidden="true" class="ki ki-close"></i> </button>
|
||||
}
|
||||
|
||||
templ Aksi_Modal(modal_id string, hx_post string, hx_target string, hx_swap string, blank bool) {
|
||||
<div>
|
||||
if !blank {
|
||||
<button
|
||||
type="button" class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btncancel"
|
||||
data-dismiss="modal" hx-indicator=".cancelloading" hx-on::after-request={ JSHideModal(modal_id) }
|
||||
hx-post={ hx_post } hx-target={ hx_target } hx-swap={ hx_swap }
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnsimpan">
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
@@ -1,61 +1,61 @@
|
||||
package corporate_daftarpeserta
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
script JSHideModal(modal_id string) {
|
||||
$(modal_id).modal('hide');
|
||||
}
|
||||
|
||||
script JSShowModal(modal_id string) {
|
||||
$(modal_id).modal('show');
|
||||
}
|
||||
|
||||
script JSGenPassReload(modal_id string, link string) {
|
||||
$(modal_id).modal('hide');
|
||||
htmx.ajax('POST', link, {target:'#content-dp', swap:'outerHTML'});
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
const btnCancel = document.querySelectorAll('.btncancel');
|
||||
const btnSimpan = document.querySelectorAll('.btnsimpan');
|
||||
|
||||
for (let i = 0; i < btnCancel.length; i++) {
|
||||
btnCancel[i].setAttribute('disabled', 'true');
|
||||
}
|
||||
for (let i = 0; i < btnSimpan.length; i++) {
|
||||
btnSimpan[i].setAttribute('disabled', 'true');
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
const btnCancel = document.querySelectorAll('.btncancel');
|
||||
const btnSimpan = document.querySelectorAll('.btnsimpan');
|
||||
|
||||
for (let i = 0; i < btnCancel.length; i++) {
|
||||
btnCancel[i].removeAttribute('disabled');
|
||||
}
|
||||
for (let i = 0; i < btnSimpan.length; i++) {
|
||||
btnSimpan[i].removeAttribute('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
package corporate_daftarpeserta
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
script JSHideModal(modal_id string) {
|
||||
$(modal_id).modal('hide');
|
||||
}
|
||||
|
||||
script JSShowModal(modal_id string) {
|
||||
$(modal_id).modal('show');
|
||||
}
|
||||
|
||||
script JSGenPassReload(modal_id string, link string) {
|
||||
$(modal_id).modal('hide');
|
||||
htmx.ajax('POST', link, {target:'#content-dp', swap:'outerHTML'});
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
const btnCancel = document.querySelectorAll('.btncancel');
|
||||
const btnSimpan = document.querySelectorAll('.btnsimpan');
|
||||
|
||||
for (let i = 0; i < btnCancel.length; i++) {
|
||||
btnCancel[i].setAttribute('disabled', 'true');
|
||||
}
|
||||
for (let i = 0; i < btnSimpan.length; i++) {
|
||||
btnSimpan[i].setAttribute('disabled', 'true');
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
const btnCancel = document.querySelectorAll('.btncancel');
|
||||
const btnSimpan = document.querySelectorAll('.btnsimpan');
|
||||
|
||||
for (let i = 0; i < btnCancel.length; i++) {
|
||||
btnCancel[i].removeAttribute('disabled');
|
||||
}
|
||||
for (let i = 0; i < btnSimpan.length; i++) {
|
||||
btnSimpan[i].removeAttribute('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,79 +1,79 @@
|
||||
package corporate_daftarpeserta
|
||||
|
||||
import "cpone/layout"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ DaftarPesertaScreen(
|
||||
table_id string, pagination_id string,
|
||||
dialog_RPT_id string, dialog_RPTBody_id string, dialog_RPT templ.Component,
|
||||
dialog_Akun_id string, dialog_AkunBody_id string, dialog_Akun templ.Component,
|
||||
dialog_GenPassword_id string, dialog_GenPasswordBody_id string, dialog_GenPassword templ.Component,
|
||||
dialog_DetailPaket_id string, dialog_DetailPaketBody_id string, dialog_Detailpaket templ.Component,
|
||||
dialog_Attachment_id string, dialog_AttachmentBody_id string, dialog_Attachment templ.Component,
|
||||
content templ.Component, filter_content templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "table-id", Name: "table-id", Type: "hidden", Value: table_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "pagination-id", Name: "pagination-id", Type: "hidden", Value: pagination_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-rpt-id", Name: "dialog-rpt-id", Type: "hidden", Value: dialog_RPT_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-rptbody-id", Name: "dialog-rptbody-id", Type: "hidden", Value: dialog_RPTBody_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-akun-id", Name: "dialog-akun-id", Type: "hidden", Value: dialog_Akun_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-akunbody-id", Name: "dialog-akunbody-id", Type: "hidden", Value: dialog_AkunBody_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-password-id", Name: "dialog-password-id", Type: "hidden", Value: dialog_GenPassword_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-passbody-id", Name: "dialog-passbody-id", Type: "hidden", Value: dialog_GenPasswordBody_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-attach-id", Name: "dialog-attach-id", Type: "hidden", Value: dialog_Attachment_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-attachbody-id", Name: "dialog-attachbody-id", Type: "hidden", Value: dialog_AttachmentBody_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-paket-id", Name: "dialog-paket-id", Type: "hidden", Value: dialog_DetailPaket_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-paketbody-id", Name: "dialog-paketbody-id", Type: "hidden", Value: dialog_DetailPaketBody_id})
|
||||
<div class="row align-items-center justify-content-center py-10">
|
||||
<div class="col-md-2 col-sm-12 p-0"></div>
|
||||
<div class="col-md-8 col-sm-12 p-0">
|
||||
<h2 class="title text-black" style="margin-bottom: 0; text-align: center;">Daftar Peserta</h2>
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button type="button" class="btn btn-primary" data-toggle="modal" data-target={"#" + dialog_GenPassword_id }>Generate Password</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@filter_content
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
@dialog_GenPassword
|
||||
@dialog_Akun
|
||||
@dialog_RPT
|
||||
@dialog_Detailpaket
|
||||
@dialog_Attachment
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSS_DaftarPeserta() {
|
||||
<style>
|
||||
.container-rpt {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JS_DaftarPeserta() {}
|
||||
|
||||
templ ShowDaftarPeserta(
|
||||
title string,
|
||||
component templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@component
|
||||
}
|
||||
package corporate_daftarpeserta
|
||||
|
||||
import "cpone/layout"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ DaftarPesertaScreen(
|
||||
table_id string, pagination_id string,
|
||||
dialog_RPT_id string, dialog_RPTBody_id string, dialog_RPT templ.Component,
|
||||
dialog_Akun_id string, dialog_AkunBody_id string, dialog_Akun templ.Component,
|
||||
dialog_GenPassword_id string, dialog_GenPasswordBody_id string, dialog_GenPassword templ.Component,
|
||||
dialog_DetailPaket_id string, dialog_DetailPaketBody_id string, dialog_Detailpaket templ.Component,
|
||||
dialog_Attachment_id string, dialog_AttachmentBody_id string, dialog_Attachment templ.Component,
|
||||
content templ.Component, filter_content templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "table-id", Name: "table-id", Type: "hidden", Value: table_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "pagination-id", Name: "pagination-id", Type: "hidden", Value: pagination_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-rpt-id", Name: "dialog-rpt-id", Type: "hidden", Value: dialog_RPT_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-rptbody-id", Name: "dialog-rptbody-id", Type: "hidden", Value: dialog_RPTBody_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-akun-id", Name: "dialog-akun-id", Type: "hidden", Value: dialog_Akun_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-akunbody-id", Name: "dialog-akunbody-id", Type: "hidden", Value: dialog_AkunBody_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-password-id", Name: "dialog-password-id", Type: "hidden", Value: dialog_GenPassword_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-passbody-id", Name: "dialog-passbody-id", Type: "hidden", Value: dialog_GenPasswordBody_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-attach-id", Name: "dialog-attach-id", Type: "hidden", Value: dialog_Attachment_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-attachbody-id", Name: "dialog-attachbody-id", Type: "hidden", Value: dialog_AttachmentBody_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-paket-id", Name: "dialog-paket-id", Type: "hidden", Value: dialog_DetailPaket_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialog-paketbody-id", Name: "dialog-paketbody-id", Type: "hidden", Value: dialog_DetailPaketBody_id})
|
||||
<div class="row align-items-center justify-content-center py-10">
|
||||
<div class="col-md-2 col-sm-12 p-0"></div>
|
||||
<div class="col-md-8 col-sm-12 p-0">
|
||||
<h2 class="title text-black" style="margin-bottom: 0; text-align: center;">Daftar Peserta</h2>
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button type="button" class="btn btn-primary" data-toggle="modal" data-target={"#" + dialog_GenPassword_id }>Generate Password</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@filter_content
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
@dialog_GenPassword
|
||||
@dialog_Akun
|
||||
@dialog_RPT
|
||||
@dialog_Detailpaket
|
||||
@dialog_Attachment
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSS_DaftarPeserta() {
|
||||
<style>
|
||||
.container-rpt {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JS_DaftarPeserta() {}
|
||||
|
||||
templ ShowDaftarPeserta(
|
||||
title string,
|
||||
component templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@component
|
||||
}
|
||||
}
|
||||
@@ -1,184 +1,184 @@
|
||||
package corporate_daftarpeserta
|
||||
|
||||
import "cpone/component/table"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ Content(tabledp templ.Component, paginationdp templ.Component) {
|
||||
<div id="content-dp" hx-on::load={ AfterRequestContent() }>
|
||||
@tabledp
|
||||
@paginationdp
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Table_DaftarPeserta(
|
||||
data []models.ModelMcuDaftarPeserta, table_id string,
|
||||
hx_get_rpt string, hx_target_rpt string, hx_include_rpt string, hx_swap_rpt string,
|
||||
hx_get_dtl string, hx_target_dtl string, hx_include_dtl string, hx_swap_dtl string,
|
||||
hx_get_acc string, hx_target_acc string, hx_include_acc string, hx_swap_acc string,
|
||||
hx_get_atc string, hx_target_atc string, hx_include_atc string, hx_swap_atc string,
|
||||
) {
|
||||
<div id={ table_id }>
|
||||
@tablecomponent.TableV3([]string{"NOMOR LAB", "NAMA", "JENIS KELAMIN", "TANGGAL LAHIR", "NAMA PAKET", "AKSI"},
|
||||
[]string{"15%","20%","15%","15%","20%","15%"},
|
||||
ItemRow(data,
|
||||
hx_get_rpt, hx_target_rpt, hx_include_rpt, hx_swap_rpt,
|
||||
hx_get_dtl, hx_target_dtl, hx_include_dtl, hx_swap_dtl,
|
||||
hx_get_acc, hx_target_acc, hx_include_acc, hx_swap_acc,
|
||||
hx_get_atc, hx_target_atc, hx_include_atc, hx_swap_atc,
|
||||
),
|
||||
)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemRow(data []models.ModelMcuDaftarPeserta,
|
||||
hx_get_rpt string, hx_target_rpt string, hx_include_rpt string, hx_swap_rpt string,
|
||||
hx_get_dtl string, hx_target_dtl string, hx_include_dtl string, hx_swap_dtl string,
|
||||
hx_get_acc string, hx_target_acc string, hx_include_acc string, hx_swap_acc string,
|
||||
hx_get_atc string, hx_target_atc string, hx_include_atc string, hx_swap_atc string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="6" class="text-center"> Data Tidak Ditemukan </td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.T_OrderHeaderLabNumber }</td>
|
||||
<td>{ v.M_PatientName }</td>
|
||||
<td>{ v.JenisKelamin }</td>
|
||||
<td>{ v.M_PatientDOB }</td>
|
||||
<td>{ v.List_Paket }</td>
|
||||
<td>@ItemAksi(v,
|
||||
hx_get_rpt, hx_target_rpt, hx_include_rpt, hx_swap_rpt,
|
||||
hx_get_dtl, hx_target_dtl, hx_include_dtl, hx_swap_dtl,
|
||||
hx_get_acc, hx_target_acc, hx_include_acc, hx_swap_acc,
|
||||
hx_get_atc, hx_target_atc, hx_include_atc, hx_swap_atc,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ ItemAksi(
|
||||
data models.ModelMcuDaftarPeserta,
|
||||
hx_get_rpt string, hx_target_rpt string, hx_include_rpt string, hx_swap_rpt string,
|
||||
hx_get_dtl string, hx_target_dtl string, hx_include_dtl string, hx_swap_dtl string,
|
||||
hx_get_acc string, hx_target_acc string, hx_include_acc string, hx_swap_acc string,
|
||||
hx_get_atc string, hx_target_atc string, hx_include_atc string, hx_swap_atc string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button" class="btn btn-icon" title="Detail test dan paket"
|
||||
hx-get={ hx_get_dtl + "?idx=" + data.T_OrderHeaderID } hx-target={ hx_target_dtl }
|
||||
hx-include={ hx_include_dtl } hx-swap={ hx_swap_dtl }
|
||||
><i class="flaticon2-list-1"></i></a>
|
||||
<a
|
||||
type="button" class="btn btn-icon" title="Detail RPT MCU"
|
||||
hx-get={ hx_get_rpt + "?idx=" + data.T_OrderHeaderID } hx-target={ hx_target_rpt }
|
||||
hx-include={ hx_include_rpt } hx-swap={ hx_swap_rpt }
|
||||
><i class="flaticon2-file"></i></a>
|
||||
<a
|
||||
type="button" class="btn btn-icon" title="Detail Attachment"
|
||||
hx-get={ hx_get_atc + "?idx=" + data.T_OrderHeaderID } hx-target={ hx_target_atc }
|
||||
hx-include={ hx_include_atc } hx-swap={ hx_swap_atc }
|
||||
><i class="flaticon-folder-1"></i></a>
|
||||
if data.AuthPatientEmail != "none" {
|
||||
<a
|
||||
type="button" class="btn btn-icon" title="Detail Akun"
|
||||
hx-get={ hx_get_acc + "?patid=" + data.M_PatientID } hx-target={ hx_target_acc }
|
||||
hx-include={ hx_include_acc } hx-swap={ hx_swap_acc }
|
||||
><i class="flaticon-user-settings"></i></a>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Table_DetailPaket(data []models.TableTestPaket) {
|
||||
<div id="table-detail-paket" style="max-height: 700px; overflow-y: auto;">
|
||||
@tablecomponent.TableV3([]string{"NOMOR", "NAMA TEST", "NAMA PAKET"},
|
||||
[]string{"20%", "40%", "40%"},
|
||||
Detail_ItemRow(data),
|
||||
)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Detail_ItemRow(data []models.TableTestPaket) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center"> Data Tidak Ditemukan </td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ strconv.Itoa(v.Nomor) }</td>
|
||||
<td>{ v.NamaTest }</td>
|
||||
<td>{ v.NamaPaket }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ Tab_RPT(data []models.TabViewReportMcu) {
|
||||
<div class="container-rpt">
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
for i, v := range data {
|
||||
if i == 0 {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href={templ.URL("#kt_tab_pat_" + strconv.Itoa(i))}>{ v.Name }</a>
|
||||
</li>
|
||||
} else {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href={templ.URL("#kt_tab_pat_" + strconv.Itoa(i))}>{ v.Name }</a>
|
||||
</li>
|
||||
}
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="patTabContent">
|
||||
for i, v := range data {
|
||||
if i == 0 {
|
||||
<div class="tab-pane fade show active" id={"kt_tab_pat_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_pat_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
} else {
|
||||
<div class="tab-pane fade show" id={"kt_tab_pat_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_pat_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Tab_Attachment(data []models.AttachmentFIle) {
|
||||
<div class="container-rpt">
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
for i, v := range data {
|
||||
// if i == 0 {
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href={templ.URL("#kt_tab_atc_" + strconv.Itoa(i))}>{ v.File_AttachmentFileName }</a>
|
||||
// </li>
|
||||
// } else {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href={templ.URL("#kt_tab_atc_" + strconv.Itoa(i))}>{ v.File_AttachmentFileName }</a>
|
||||
</li>
|
||||
// }
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="atcTabContent" style="min-height: 700px;">
|
||||
if len(data) == 0 {
|
||||
<div style="min-height: 350px;"></div>
|
||||
<h3 class="text-center">Tidak ada file</h3>
|
||||
}
|
||||
for i, v := range data {
|
||||
// if i == 0 {
|
||||
// <div class="tab-pane fade show" id={"kt_tab_atc_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_atc_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
// <object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// } else {
|
||||
<div class="tab-pane fade show" id={"kt_tab_atc_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_atc_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
// }
|
||||
}
|
||||
</div>
|
||||
package corporate_daftarpeserta
|
||||
|
||||
import "cpone/component/table"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ Content(tabledp templ.Component, paginationdp templ.Component) {
|
||||
<div id="content-dp" hx-on::load={ AfterRequestContent() }>
|
||||
@tabledp
|
||||
@paginationdp
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Table_DaftarPeserta(
|
||||
data []models.ModelMcuDaftarPeserta, table_id string,
|
||||
hx_get_rpt string, hx_target_rpt string, hx_include_rpt string, hx_swap_rpt string,
|
||||
hx_get_dtl string, hx_target_dtl string, hx_include_dtl string, hx_swap_dtl string,
|
||||
hx_get_acc string, hx_target_acc string, hx_include_acc string, hx_swap_acc string,
|
||||
hx_get_atc string, hx_target_atc string, hx_include_atc string, hx_swap_atc string,
|
||||
) {
|
||||
<div id={ table_id }>
|
||||
@tablecomponent.TableV3([]string{"NOMOR LAB", "NAMA", "JENIS KELAMIN", "TANGGAL LAHIR", "NAMA PAKET", "AKSI"},
|
||||
[]string{"15%","20%","15%","15%","20%","15%"},
|
||||
ItemRow(data,
|
||||
hx_get_rpt, hx_target_rpt, hx_include_rpt, hx_swap_rpt,
|
||||
hx_get_dtl, hx_target_dtl, hx_include_dtl, hx_swap_dtl,
|
||||
hx_get_acc, hx_target_acc, hx_include_acc, hx_swap_acc,
|
||||
hx_get_atc, hx_target_atc, hx_include_atc, hx_swap_atc,
|
||||
),
|
||||
)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemRow(data []models.ModelMcuDaftarPeserta,
|
||||
hx_get_rpt string, hx_target_rpt string, hx_include_rpt string, hx_swap_rpt string,
|
||||
hx_get_dtl string, hx_target_dtl string, hx_include_dtl string, hx_swap_dtl string,
|
||||
hx_get_acc string, hx_target_acc string, hx_include_acc string, hx_swap_acc string,
|
||||
hx_get_atc string, hx_target_atc string, hx_include_atc string, hx_swap_atc string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="6" class="text-center"> Data Tidak Ditemukan </td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.T_OrderHeaderLabNumber }</td>
|
||||
<td>{ v.M_PatientName }</td>
|
||||
<td>{ v.JenisKelamin }</td>
|
||||
<td>{ v.M_PatientDOB }</td>
|
||||
<td>{ v.List_Paket }</td>
|
||||
<td>@ItemAksi(v,
|
||||
hx_get_rpt, hx_target_rpt, hx_include_rpt, hx_swap_rpt,
|
||||
hx_get_dtl, hx_target_dtl, hx_include_dtl, hx_swap_dtl,
|
||||
hx_get_acc, hx_target_acc, hx_include_acc, hx_swap_acc,
|
||||
hx_get_atc, hx_target_atc, hx_include_atc, hx_swap_atc,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ ItemAksi(
|
||||
data models.ModelMcuDaftarPeserta,
|
||||
hx_get_rpt string, hx_target_rpt string, hx_include_rpt string, hx_swap_rpt string,
|
||||
hx_get_dtl string, hx_target_dtl string, hx_include_dtl string, hx_swap_dtl string,
|
||||
hx_get_acc string, hx_target_acc string, hx_include_acc string, hx_swap_acc string,
|
||||
hx_get_atc string, hx_target_atc string, hx_include_atc string, hx_swap_atc string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button" class="btn btn-icon" title="Detail test dan paket"
|
||||
hx-get={ hx_get_dtl + "?idx=" + data.T_OrderHeaderID } hx-target={ hx_target_dtl }
|
||||
hx-include={ hx_include_dtl } hx-swap={ hx_swap_dtl }
|
||||
><i class="flaticon2-list-1"></i></a>
|
||||
<a
|
||||
type="button" class="btn btn-icon" title="Detail RPT MCU"
|
||||
hx-get={ hx_get_rpt + "?idx=" + data.T_OrderHeaderID } hx-target={ hx_target_rpt }
|
||||
hx-include={ hx_include_rpt } hx-swap={ hx_swap_rpt }
|
||||
><i class="flaticon2-file"></i></a>
|
||||
<a
|
||||
type="button" class="btn btn-icon" title="Detail Attachment"
|
||||
hx-get={ hx_get_atc + "?idx=" + data.T_OrderHeaderID } hx-target={ hx_target_atc }
|
||||
hx-include={ hx_include_atc } hx-swap={ hx_swap_atc }
|
||||
><i class="flaticon-folder-1"></i></a>
|
||||
if data.AuthPatientEmail != "none" {
|
||||
<a
|
||||
type="button" class="btn btn-icon" title="Detail Akun"
|
||||
hx-get={ hx_get_acc + "?patid=" + data.M_PatientID } hx-target={ hx_target_acc }
|
||||
hx-include={ hx_include_acc } hx-swap={ hx_swap_acc }
|
||||
><i class="flaticon-user-settings"></i></a>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Table_DetailPaket(data []models.TableTestPaket) {
|
||||
<div id="table-detail-paket" style="max-height: 700px; overflow-y: auto;">
|
||||
@tablecomponent.TableV3([]string{"NOMOR", "NAMA TEST", "NAMA PAKET"},
|
||||
[]string{"20%", "40%", "40%"},
|
||||
Detail_ItemRow(data),
|
||||
)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Detail_ItemRow(data []models.TableTestPaket) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center"> Data Tidak Ditemukan </td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ strconv.Itoa(v.Nomor) }</td>
|
||||
<td>{ v.NamaTest }</td>
|
||||
<td>{ v.NamaPaket }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ Tab_RPT(data []models.TabViewReportMcu) {
|
||||
<div class="container-rpt">
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
for i, v := range data {
|
||||
if i == 0 {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href={templ.URL("#kt_tab_pat_" + strconv.Itoa(i))}>{ v.Name }</a>
|
||||
</li>
|
||||
} else {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href={templ.URL("#kt_tab_pat_" + strconv.Itoa(i))}>{ v.Name }</a>
|
||||
</li>
|
||||
}
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="patTabContent">
|
||||
for i, v := range data {
|
||||
if i == 0 {
|
||||
<div class="tab-pane fade show active" id={"kt_tab_pat_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_pat_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
} else {
|
||||
<div class="tab-pane fade show" id={"kt_tab_pat_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_pat_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Tab_Attachment(data []models.AttachmentFIle) {
|
||||
<div class="container-rpt">
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
for i, v := range data {
|
||||
// if i == 0 {
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href={templ.URL("#kt_tab_atc_" + strconv.Itoa(i))}>{ v.File_AttachmentFileName }</a>
|
||||
// </li>
|
||||
// } else {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href={templ.URL("#kt_tab_atc_" + strconv.Itoa(i))}>{ v.File_AttachmentFileName }</a>
|
||||
</li>
|
||||
// }
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="atcTabContent" style="min-height: 700px;">
|
||||
if len(data) == 0 {
|
||||
<div style="min-height: 350px;"></div>
|
||||
<h3 class="text-center">Tidak ada file</h3>
|
||||
}
|
||||
for i, v := range data {
|
||||
// if i == 0 {
|
||||
// <div class="tab-pane fade show" id={"kt_tab_atc_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_atc_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
// <object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// } else {
|
||||
<div class="tab-pane fade show" id={"kt_tab_atc_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_atc_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
// }
|
||||
}
|
||||
</div>
|
||||
}
|
||||
@@ -1,50 +1,50 @@
|
||||
package corporate_kelainanfisik
|
||||
|
||||
templ KelainanFisikScreen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kelainan Fisik</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 47%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
package corporate_kelainanfisik
|
||||
|
||||
templ KelainanFisikScreen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kelainan Fisik</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 47%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,50 +1,50 @@
|
||||
package corporate_kelainanglobal
|
||||
|
||||
templ KelainanGlobal_Screen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kelainan Global</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 100%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
package corporate_kelainanglobal
|
||||
|
||||
templ KelainanGlobal_Screen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kelainan Global</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 100%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,50 +1,50 @@
|
||||
package corporate_kelainanlab
|
||||
|
||||
templ KelainanLabScreen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kelainan Lab</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 47%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
package corporate_kelainanlab
|
||||
|
||||
templ KelainanLabScreen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kelainan Lab</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 47%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,50 +1,50 @@
|
||||
package corporate_kelainannonlab
|
||||
|
||||
templ KelainanNonlabScreen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kelainan Non Lab</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 47%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
package corporate_kelainannonlab
|
||||
|
||||
templ KelainanNonlabScreen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kelainan Non Lab</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 47%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,50 +1,50 @@
|
||||
package corporate_kepesertaan
|
||||
|
||||
templ KepesertaanScreen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kepesertaan MCU</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 47%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
package corporate_kepesertaan
|
||||
|
||||
templ KepesertaanScreen(chart_xs []templ.Component, chart_md []templ.Component, chart_lg []templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Data Kepesertaan MCU</h2>
|
||||
</div>
|
||||
|
||||
// xs
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_xs {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// md
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_md {
|
||||
<div class="col-12 my-4">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
// lg
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row justify-content-center">
|
||||
for _, v := range chart_lg {
|
||||
<div class="m-4" style="width: 47%;">
|
||||
@Chart_Card(v)
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Chart_Card(chart templ.Component) {
|
||||
<div class="card shadow p-4" style="display: flex; justify-content: center; align-items: center; height: 100%; width: 100%;">
|
||||
<div class="d-flex flex-column pt-8" style="width: 100%;">
|
||||
@chart
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,53 +1,53 @@
|
||||
package corporate_kesimpulan
|
||||
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ KesimpulanScreen(
|
||||
table_id string, content_lab templ.Component,
|
||||
content_nonlab templ.Component, content_fisik templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "table-id", Name: "table-id", Type: "hidden", Value: table_id})
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;"> Kesimpulan </h2>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content_lab
|
||||
@content_nonlab
|
||||
@content_fisik
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSKesimpulan() {
|
||||
<style>
|
||||
.dot-text {
|
||||
position: relative;
|
||||
padding-left: 1.5em; /* Menambahkan padding untuk memberi ruang pada titik */
|
||||
}
|
||||
|
||||
.dot-text::before {
|
||||
content: "•"; /* Menambahkan titik di depan teks */
|
||||
position: absolute;
|
||||
left: 1em; /* Atur posisi titik */
|
||||
top: 0;
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.information-title {
|
||||
color: #0e1e28;
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
package corporate_kesimpulan
|
||||
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ KesimpulanScreen(
|
||||
table_id string, content_lab templ.Component,
|
||||
content_nonlab templ.Component, content_fisik templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "table-id", Name: "table-id", Type: "hidden", Value: table_id})
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;"> Kesimpulan </h2>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content_lab
|
||||
@content_nonlab
|
||||
@content_fisik
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSKesimpulan() {
|
||||
<style>
|
||||
.dot-text {
|
||||
position: relative;
|
||||
padding-left: 1.5em; /* Menambahkan padding untuk memberi ruang pada titik */
|
||||
}
|
||||
|
||||
.dot-text::before {
|
||||
content: "•"; /* Menambahkan titik di depan teks */
|
||||
position: absolute;
|
||||
left: 1em; /* Atur posisi titik */
|
||||
top: 0;
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.information-title {
|
||||
color: #0e1e28;
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
@@ -1,35 +1,35 @@
|
||||
package corporate_kesimpulan
|
||||
|
||||
import (
|
||||
"cpone/component/table"
|
||||
"cpone/models"
|
||||
"strconv"
|
||||
)
|
||||
|
||||
templ Table_Kesimpulan(title string, data []models.ModelKesimpulanLab, table_id string) {
|
||||
<div class="card card-custom gutter-b" style="border-radius: 20px;">
|
||||
<div style="padding-top: 12px;">
|
||||
<h3 class="card-label dot-text text-black">{ title }</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div id={ table_id }>
|
||||
@tablecomponent.TableV3([]string{"NO", "PEMERIKSAAN", "PRESENTASE"}, []string{"5%", "70%", "25%"}, Row_Kesimpulan(data))
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Row_Kesimpulan(data []models.ModelKesimpulanLab) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for i, v := range data {
|
||||
<tr>
|
||||
<td>{ strconv.Itoa(i + 1) }</td>
|
||||
<td>{ v.Test }</td>
|
||||
<td>{ v.Total }</td>
|
||||
</tr>
|
||||
}
|
||||
package corporate_kesimpulan
|
||||
|
||||
import (
|
||||
"cpone/component/table"
|
||||
"cpone/models"
|
||||
"strconv"
|
||||
)
|
||||
|
||||
templ Table_Kesimpulan(title string, data []models.ModelKesimpulanLab, table_id string) {
|
||||
<div class="card card-custom gutter-b" style="border-radius: 20px;">
|
||||
<div style="padding-top: 12px;">
|
||||
<h3 class="card-label dot-text text-black">{ title }</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div id={ table_id }>
|
||||
@tablecomponent.TableV3([]string{"NO", "PEMERIKSAAN", "PRESENTASE"}, []string{"5%", "70%", "25%"}, Row_Kesimpulan(data))
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Row_Kesimpulan(data []models.ModelKesimpulanLab) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for i, v := range data {
|
||||
<tr>
|
||||
<td>{ strconv.Itoa(i + 1) }</td>
|
||||
<td>{ v.Test }</td>
|
||||
<td>{ v.Total }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
@@ -1,23 +1,23 @@
|
||||
package corporate_keuangan
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
package corporate_keuangan
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
@@ -1,64 +1,64 @@
|
||||
package corporate_keuangan
|
||||
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ Tab_Keuangan(
|
||||
table_id string, pagination_id string,
|
||||
summary_card templ.Component, content templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "table-id", Name: "table-id", Type: "hidden", Value: table_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "pagination-id", Name: "pagination-id", Type: "hidden", Value: pagination_id})
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Keuangan</h2>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@summary_card
|
||||
@content
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Summary_Card(total_order string, total_tagihan string, total_lunas string, total_hutang string) {
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
<div class="card bg-primary-transparent shadow p-4">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Order</h3>
|
||||
<h1 class="font-weight-bolder ml-auto mt-4">{ total_order }</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="card bg-warning-transparent shadow p-4">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Tagihan</h3>
|
||||
<h1 class="font-weight-bolder ml-auto mt-4">{ total_tagihan }</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="card bg-success-transparent shadow p-4">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Pelunasan</h3>
|
||||
<h1 class="font-weight-bolder ml-auto mt-4">{ total_lunas }</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="card bg-danger-transparent shadow p-4">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Hutang</h3>
|
||||
<h1 class="font-weight-bolder ml-auto mt-4">{ total_hutang }</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
package corporate_keuangan
|
||||
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ Tab_Keuangan(
|
||||
table_id string, pagination_id string,
|
||||
summary_card templ.Component, content templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "table-id", Name: "table-id", Type: "hidden", Value: table_id})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "pagination-id", Name: "pagination-id", Type: "hidden", Value: pagination_id})
|
||||
<div class="d-flex justify-content-center py-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0;">Keuangan</h2>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@summary_card
|
||||
@content
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Summary_Card(total_order string, total_tagihan string, total_lunas string, total_hutang string) {
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
<div class="card bg-primary-transparent shadow p-4">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Order</h3>
|
||||
<h1 class="font-weight-bolder ml-auto mt-4">{ total_order }</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="card bg-warning-transparent shadow p-4">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Tagihan</h3>
|
||||
<h1 class="font-weight-bolder ml-auto mt-4">{ total_tagihan }</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="card bg-success-transparent shadow p-4">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Pelunasan</h3>
|
||||
<h1 class="font-weight-bolder ml-auto mt-4">{ total_lunas }</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="card bg-danger-transparent shadow p-4">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Hutang</h3>
|
||||
<h1 class="font-weight-bolder ml-auto mt-4">{ total_hutang }</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,98 +1,98 @@
|
||||
package corporate_keuangan
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
import "cpone/utils"
|
||||
|
||||
templ Content(tablecomp templ.Component, paginationcomp templ.Component) {
|
||||
<div id="content-uang" hx-on::load={ AfterRequestContent() }>
|
||||
@tablecomp
|
||||
@paginationcomp
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Table_Keuangan(data []models.KeuanganModel, table_id string) {
|
||||
<div id={ table_id } class="mt-8">
|
||||
<table class="table table-hover table-bordered">
|
||||
<thead>
|
||||
<tr class="rounded-lg bg-header-table">
|
||||
<th scope="col" class="text-center col-5" colspan="3"><h4>TAGIHAN</h4></th>
|
||||
<th scope="col" class="text-center col-4" colspan="2"><h4>PELUNASAN</h4></th>
|
||||
<th scope="col" class="text-center col-5" rowspan="2" style="vertical-align: middle;"><h4>SISA</h4></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="col" class="text-center">No/Tgl</th>
|
||||
<th scope="col" class="text-center">Tgl Jatuh Tempo</th>
|
||||
<th scope="col" class="text-center">Jumlah</th>
|
||||
<th scope="col" class="text-center">No/Tgl</th>
|
||||
<th scope="col" class="text-center">Jumlah</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@Row_Keuangan(data)
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Row_Keuangan(data []models.KeuanganModel) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="6" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
if len(v.BillPayment) == 0 {
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<div>{ v.F_BillNo }</div>
|
||||
<div>{ v.F_BillCreated }</div>
|
||||
</td>
|
||||
<td class="text-center">{ v.F_BillDueDate }</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(v.F_BillTotal) }</td>
|
||||
<td class="text-center">-</td>
|
||||
<td class="text-center">-</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(v.F_BillUnpaid) }</td>
|
||||
</tr>
|
||||
} else if len(v.BillPayment) == 1 {
|
||||
<tr>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>
|
||||
<div>{ v.F_BillNo }</div>
|
||||
<div>{ v.F_BillCreated }</div>
|
||||
</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ v.F_BillDueDate }</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ utils.FormatRibuan(v.F_BillTotal) }</td>
|
||||
<td class="text-center">
|
||||
<div>{ v.BillPayment[0].F_BillPaymentNumber }</div>
|
||||
<div>{ v.BillPayment[0].F_BillPaymentDate }</div>
|
||||
</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(int(v.BillPayment[0].F_BillPaymentAmount)) }</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ utils.FormatRibuan(v.F_BillUnpaid) }</td>
|
||||
</tr>
|
||||
} else {
|
||||
<tr>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>
|
||||
<div>{ v.F_BillNo }</div>
|
||||
<div>{ v.F_BillCreated }</div>
|
||||
</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ v.F_BillDueDate }</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ utils.FormatRibuan(v.F_BillTotal) }</td>
|
||||
<td class="text-center">
|
||||
<div>{ v.BillPayment[0].F_BillPaymentNumber }</div>
|
||||
<div>{ v.BillPayment[0].F_BillPaymentDate }</div>
|
||||
</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(int(v.BillPayment[0].F_BillPaymentAmount)) }</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ utils.FormatRibuan(v.F_BillUnpaid) }</td>
|
||||
</tr>
|
||||
for i := 1; i < len(v.BillPayment); i++ {
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<div>{ v.BillPayment[i].F_BillPaymentNumber }</div>
|
||||
<div>{ v.BillPayment[i].F_BillPaymentDate }</div>
|
||||
</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(int(v.BillPayment[i].F_BillPaymentAmount)) }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
}
|
||||
package corporate_keuangan
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
import "cpone/utils"
|
||||
|
||||
templ Content(tablecomp templ.Component, paginationcomp templ.Component) {
|
||||
<div id="content-uang" hx-on::load={ AfterRequestContent() }>
|
||||
@tablecomp
|
||||
@paginationcomp
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Table_Keuangan(data []models.KeuanganModel, table_id string) {
|
||||
<div id={ table_id } class="mt-8">
|
||||
<table class="table table-hover table-bordered">
|
||||
<thead>
|
||||
<tr class="rounded-lg bg-header-table">
|
||||
<th scope="col" class="text-center col-5" colspan="3"><h4>TAGIHAN</h4></th>
|
||||
<th scope="col" class="text-center col-4" colspan="2"><h4>PELUNASAN</h4></th>
|
||||
<th scope="col" class="text-center col-5" rowspan="2" style="vertical-align: middle;"><h4>SISA</h4></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="col" class="text-center">No/Tgl</th>
|
||||
<th scope="col" class="text-center">Tgl Jatuh Tempo</th>
|
||||
<th scope="col" class="text-center">Jumlah</th>
|
||||
<th scope="col" class="text-center">No/Tgl</th>
|
||||
<th scope="col" class="text-center">Jumlah</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@Row_Keuangan(data)
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Row_Keuangan(data []models.KeuanganModel) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="6" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
if len(v.BillPayment) == 0 {
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<div>{ v.F_BillNo }</div>
|
||||
<div>{ v.F_BillCreated }</div>
|
||||
</td>
|
||||
<td class="text-center">{ v.F_BillDueDate }</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(v.F_BillTotal) }</td>
|
||||
<td class="text-center">-</td>
|
||||
<td class="text-center">-</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(v.F_BillUnpaid) }</td>
|
||||
</tr>
|
||||
} else if len(v.BillPayment) == 1 {
|
||||
<tr>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>
|
||||
<div>{ v.F_BillNo }</div>
|
||||
<div>{ v.F_BillCreated }</div>
|
||||
</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ v.F_BillDueDate }</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ utils.FormatRibuan(v.F_BillTotal) }</td>
|
||||
<td class="text-center">
|
||||
<div>{ v.BillPayment[0].F_BillPaymentNumber }</div>
|
||||
<div>{ v.BillPayment[0].F_BillPaymentDate }</div>
|
||||
</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(int(v.BillPayment[0].F_BillPaymentAmount)) }</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ utils.FormatRibuan(v.F_BillUnpaid) }</td>
|
||||
</tr>
|
||||
} else {
|
||||
<tr>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>
|
||||
<div>{ v.F_BillNo }</div>
|
||||
<div>{ v.F_BillCreated }</div>
|
||||
</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ v.F_BillDueDate }</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ utils.FormatRibuan(v.F_BillTotal) }</td>
|
||||
<td class="text-center">
|
||||
<div>{ v.BillPayment[0].F_BillPaymentNumber }</div>
|
||||
<div>{ v.BillPayment[0].F_BillPaymentDate }</div>
|
||||
</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(int(v.BillPayment[0].F_BillPaymentAmount)) }</td>
|
||||
<td class="text-center" rowspan={ strconv.Itoa(len(v.BillPayment)) }>{ utils.FormatRibuan(v.F_BillUnpaid) }</td>
|
||||
</tr>
|
||||
for i := 1; i < len(v.BillPayment); i++ {
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<div>{ v.BillPayment[i].F_BillPaymentNumber }</div>
|
||||
<div>{ v.BillPayment[i].F_BillPaymentDate }</div>
|
||||
</td>
|
||||
<td class="text-center">{ utils.FormatRibuan(int(v.BillPayment[i].F_BillPaymentAmount)) }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,90 +1,90 @@
|
||||
package corporate_mcudetail
|
||||
|
||||
templ TabViewMcuDetail(
|
||||
id string,
|
||||
) {
|
||||
<div>
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link active" data-toggle="tab" href="#kt_tab_pane_1" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkepesertaan"} hx-target="#tabkepesertaan" hx-trigger="load" hx-indicator=".kepesertaanloading">Peserta</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_2" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkelainanglobal"} hx-target="#tabkelainanglobal" hx-trigger="load" hx-indicator=".globalloading">Kelainan global</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_3" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkelainanlab"} hx-target="#tabkelainanlab" hx-trigger="load" hx-indicator=".labloading">Kelainan Lab</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_4" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkelainannonlab"} hx-target="#tabkelainannonlab" hx-trigger="load" hx-indicator=".nonlabloading">kelainan Non Lab</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_5" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkelainanfisik"} hx-target="#tabkelainanfisik" hx-trigger="load" hx-indicator=".fisikloading">kelainan Fisik</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_6" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkesimpulan"} hx-target="#tabkesimpulan" hx-indicator=".kesimpulanloading">Kesimpulan</a>
|
||||
// </li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_7" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabdaftarpeserta"} hx-target="#tabdaftarpeserta" hx-indicator=".daftperloading">Daftar Peserta</a>
|
||||
</li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_8">Executive Summary</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_9" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkeuangan"} hx-target="#tabkeuangan" hx-indicator=".uangloading">Keuangan</a>
|
||||
// </li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="myTabContent">
|
||||
// <div class="tab-pane fade show active" id="kt_tab_pane_1" role="tabpanel" aria-labelledby="kt_tab_pane_1">
|
||||
// <div id="tabkepesertaan"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg kepesertaanloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_2" role="tabpanel" aria-labelledby="kt_tab_pane_2">
|
||||
// <div id="tabkelainanglobal"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg globalloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_3" role="tabpanel" aria-labelledby="kt_tab_pane_3">
|
||||
// <div id="tabkelainanlab"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg labloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_4" role="tabpanel" aria-labelledby="kt_tab_pane_4" style="height: 800px;">
|
||||
// <div id="tabkelainannonlab"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg nonlabloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_5" role="tabpanel" aria-labelledby="kt_tab_pane_5">
|
||||
// <div id="tabkelainanfisik"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg fisikloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_6" role="tabpanel" aria-labelledby="kt_tab_pane_6">
|
||||
// <div id="tabkesimpulan"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg kesimpulanloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_7" role="tabpanel" aria-labelledby="kt_tab_pane_7">
|
||||
<div id="tabdaftarpeserta"></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class="htmx-indicator spinner-border spinner-border-lg daftperloading" role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_8" role="tabpanel" aria-labelledby="kt_tab_pane_8" style="height: 800px;">
|
||||
// <object data={"/birt/run?__report=report/one/mcu/rpt_executive_summary_mcu_001.rptdesign&__format=pdf&PID="+id+"&username=admin&tm=1722914077866"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_9" role="tabpanel" aria-labelledby="kt_tab_pane_9">
|
||||
// <div id="tabkeuangan"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg uangloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
</div>
|
||||
package corporate_mcudetail
|
||||
|
||||
templ TabViewMcuDetail(
|
||||
id string,
|
||||
) {
|
||||
<div>
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link active" data-toggle="tab" href="#kt_tab_pane_1" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkepesertaan"} hx-target="#tabkepesertaan" hx-trigger="load" hx-indicator=".kepesertaanloading">Peserta</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_2" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkelainanglobal"} hx-target="#tabkelainanglobal" hx-trigger="load" hx-indicator=".globalloading">Kelainan global</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_3" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkelainanlab"} hx-target="#tabkelainanlab" hx-trigger="load" hx-indicator=".labloading">Kelainan Lab</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_4" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkelainannonlab"} hx-target="#tabkelainannonlab" hx-trigger="load" hx-indicator=".nonlabloading">kelainan Non Lab</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_5" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkelainanfisik"} hx-target="#tabkelainanfisik" hx-trigger="load" hx-indicator=".fisikloading">kelainan Fisik</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_6" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkesimpulan"} hx-target="#tabkesimpulan" hx-indicator=".kesimpulanloading">Kesimpulan</a>
|
||||
// </li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_7" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabdaftarpeserta"} hx-target="#tabdaftarpeserta" hx-indicator=".daftperloading">Daftar Peserta</a>
|
||||
</li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_8">Executive Summary</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pane_9" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkeuangan"} hx-target="#tabkeuangan" hx-indicator=".uangloading">Keuangan</a>
|
||||
// </li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="myTabContent">
|
||||
// <div class="tab-pane fade show active" id="kt_tab_pane_1" role="tabpanel" aria-labelledby="kt_tab_pane_1">
|
||||
// <div id="tabkepesertaan"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg kepesertaanloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_2" role="tabpanel" aria-labelledby="kt_tab_pane_2">
|
||||
// <div id="tabkelainanglobal"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg globalloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_3" role="tabpanel" aria-labelledby="kt_tab_pane_3">
|
||||
// <div id="tabkelainanlab"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg labloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_4" role="tabpanel" aria-labelledby="kt_tab_pane_4" style="height: 800px;">
|
||||
// <div id="tabkelainannonlab"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg nonlabloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_5" role="tabpanel" aria-labelledby="kt_tab_pane_5">
|
||||
// <div id="tabkelainanfisik"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg fisikloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_6" role="tabpanel" aria-labelledby="kt_tab_pane_6">
|
||||
// <div id="tabkesimpulan"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg kesimpulanloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_7" role="tabpanel" aria-labelledby="kt_tab_pane_7">
|
||||
<div id="tabdaftarpeserta"></div>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<span class="htmx-indicator spinner-border spinner-border-lg daftperloading" role="status" aria-hidden="true"></span>
|
||||
</div>
|
||||
</div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_8" role="tabpanel" aria-labelledby="kt_tab_pane_8" style="height: 800px;">
|
||||
// <object data={"/birt/run?__report=report/one/mcu/rpt_executive_summary_mcu_001.rptdesign&__format=pdf&PID="+id+"&username=admin&tm=1722914077866"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pane_9" role="tabpanel" aria-labelledby="kt_tab_pane_9">
|
||||
// <div id="tabkeuangan"></div>
|
||||
// <div style="display: flex; justify-content: center; align-items: center;">
|
||||
// <span class="htmx-indicator spinner-border spinner-border-lg uangloading" role="status" aria-hidden="true"></span>
|
||||
// </div>
|
||||
// </div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,88 +1,88 @@
|
||||
package corporate_patient
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ ListingData(
|
||||
data []models.DashboardPatient,
|
||||
listID string,
|
||||
hxGet string,
|
||||
hxTarget string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
) {
|
||||
<div id={listID} class="align-items-center py-8 flex-column">
|
||||
<div class="bg-field rounded">
|
||||
<div class="p-8">
|
||||
for i, d := range data {
|
||||
if i == (len(data) - 1) {
|
||||
<div id={ strconv.Itoa(d.T_OrderHeaderID) } class="card shadow p-8">
|
||||
@ItemCard(d,
|
||||
hxGet,
|
||||
hxTarget,
|
||||
hxInclude,
|
||||
hxSwap,
|
||||
)
|
||||
</div>
|
||||
} else {
|
||||
<div id={ strconv.Itoa(d.T_OrderHeaderID) } class="card shadow p-8 mb-8">
|
||||
@ItemCard(d,
|
||||
hxGet,
|
||||
hxTarget,
|
||||
hxInclude,
|
||||
hxSwap,
|
||||
)
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemCard(
|
||||
data models.DashboardPatient,
|
||||
hxGet string,
|
||||
hxTarget string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
) {
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-8">
|
||||
<h4 class="text-black">{ data.T_OrderHeaderLabNumber }</h4>
|
||||
</div>
|
||||
<div class="col-3" style="text-align: right;">
|
||||
<h4 class="text-black">{ data.T_OrderHeaderDate }</h4>
|
||||
</div>
|
||||
<div class="col-1">
|
||||
<a
|
||||
type="button"
|
||||
class="btncetak"
|
||||
hx-get={ hxGet +"?id=" + strconv.Itoa(data.T_OrderHeaderID) }
|
||||
hx-target={ hxTarget }
|
||||
hx-swap={ hxSwap }
|
||||
hx-include={ hxInclude }
|
||||
>
|
||||
<i class="flaticon-doc"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btncetak');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btncetak');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
package corporate_patient
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ ListingData(
|
||||
data []models.DashboardPatient,
|
||||
listID string,
|
||||
hxGet string,
|
||||
hxTarget string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
) {
|
||||
<div id={listID} class="align-items-center py-8 flex-column">
|
||||
<div class="bg-field rounded">
|
||||
<div class="p-8">
|
||||
for i, d := range data {
|
||||
if i == (len(data) - 1) {
|
||||
<div id={ strconv.Itoa(d.T_OrderHeaderID) } class="card shadow p-8">
|
||||
@ItemCard(d,
|
||||
hxGet,
|
||||
hxTarget,
|
||||
hxInclude,
|
||||
hxSwap,
|
||||
)
|
||||
</div>
|
||||
} else {
|
||||
<div id={ strconv.Itoa(d.T_OrderHeaderID) } class="card shadow p-8 mb-8">
|
||||
@ItemCard(d,
|
||||
hxGet,
|
||||
hxTarget,
|
||||
hxInclude,
|
||||
hxSwap,
|
||||
)
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemCard(
|
||||
data models.DashboardPatient,
|
||||
hxGet string,
|
||||
hxTarget string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
) {
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-8">
|
||||
<h4 class="text-black">{ data.T_OrderHeaderLabNumber }</h4>
|
||||
</div>
|
||||
<div class="col-3" style="text-align: right;">
|
||||
<h4 class="text-black">{ data.T_OrderHeaderDate }</h4>
|
||||
</div>
|
||||
<div class="col-1">
|
||||
<a
|
||||
type="button"
|
||||
class="btncetak"
|
||||
hx-get={ hxGet +"?id=" + strconv.Itoa(data.T_OrderHeaderID) }
|
||||
hx-target={ hxTarget }
|
||||
hx-swap={ hxSwap }
|
||||
hx-include={ hxInclude }
|
||||
>
|
||||
<i class="flaticon-doc"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btncetak');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btncetak');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
@@ -1,169 +1,169 @@
|
||||
package corporate_patient
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
|
||||
templ DashboardPat(
|
||||
listID string,
|
||||
paginationID string,
|
||||
dialogID string,
|
||||
dialogBodyID string,
|
||||
) {
|
||||
<div id="content-container" class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "listID",
|
||||
Name: "listID",
|
||||
Type: "hidden",
|
||||
Value: listID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogID",
|
||||
Name: "dialogID",
|
||||
Type: "hidden",
|
||||
Value: dialogID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogBodyID",
|
||||
Name: "dialogBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "userEmail",
|
||||
Name: "userEmail",
|
||||
Type: "hidden"})
|
||||
<div
|
||||
id="content-page"
|
||||
hx-get="/corp/dashboard_pat/content"
|
||||
hx-swap="outerHTML"
|
||||
hx-trigger="load delay:500ms"
|
||||
hx-target="#content-page"
|
||||
hx-include="#listID, #paginationID, #dialogID, #dialogBodyID, #userEmail"
|
||||
hx-on::after-request={ AfterRequestContent() }
|
||||
>
|
||||
<div id="loading-parent" class="rounded overlay overlay-block" style="display: flex; align-items: center; justify-content: center; height: 70vh;">
|
||||
<div id="loading-child" class="rounded bg-transparent overlay-layer">
|
||||
<div id="loading-spinner" class="spinner-border text-primary" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ContentPage(
|
||||
breadcrumb templ.Component,
|
||||
content templ.Component,
|
||||
modaldialog templ.Component,
|
||||
) {
|
||||
// <div
|
||||
// id="content-page"
|
||||
// >
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content
|
||||
@modaldialog
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
// </div>
|
||||
}
|
||||
|
||||
templ ContentP(
|
||||
listingcomponent templ.Component,
|
||||
paginationcomponent templ.Component,
|
||||
) {
|
||||
<div id="contentlayout" hx-on::load={ AfterRequestContent() }>
|
||||
@listingcomponent
|
||||
@paginationcomponent
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSDashboardPat() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ JSDashboardPat() {
|
||||
<script>
|
||||
document.addEventListener(`DOMContentLoaded`, (event) => {
|
||||
const data = localStorage.getItem(`user`);
|
||||
if (data) {
|
||||
const parsedData = JSON.parse(data);
|
||||
// console.log(parsedData.M_UserEmail);
|
||||
document.getElementById('userEmail').value = parsedData.M_UserEmail;
|
||||
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
templ ShowDashboardPat(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package corporate_patient
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
|
||||
templ DashboardPat(
|
||||
listID string,
|
||||
paginationID string,
|
||||
dialogID string,
|
||||
dialogBodyID string,
|
||||
) {
|
||||
<div id="content-container" class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "listID",
|
||||
Name: "listID",
|
||||
Type: "hidden",
|
||||
Value: listID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogID",
|
||||
Name: "dialogID",
|
||||
Type: "hidden",
|
||||
Value: dialogID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogBodyID",
|
||||
Name: "dialogBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "userEmail",
|
||||
Name: "userEmail",
|
||||
Type: "hidden"})
|
||||
<div
|
||||
id="content-page"
|
||||
hx-get="/corp/dashboard_pat/content"
|
||||
hx-swap="outerHTML"
|
||||
hx-trigger="load delay:500ms"
|
||||
hx-target="#content-page"
|
||||
hx-include="#listID, #paginationID, #dialogID, #dialogBodyID, #userEmail"
|
||||
hx-on::after-request={ AfterRequestContent() }
|
||||
>
|
||||
<div id="loading-parent" class="rounded overlay overlay-block" style="display: flex; align-items: center; justify-content: center; height: 70vh;">
|
||||
<div id="loading-child" class="rounded bg-transparent overlay-layer">
|
||||
<div id="loading-spinner" class="spinner-border text-primary" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ContentPage(
|
||||
breadcrumb templ.Component,
|
||||
content templ.Component,
|
||||
modaldialog templ.Component,
|
||||
) {
|
||||
// <div
|
||||
// id="content-page"
|
||||
// >
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content
|
||||
@modaldialog
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
// </div>
|
||||
}
|
||||
|
||||
templ ContentP(
|
||||
listingcomponent templ.Component,
|
||||
paginationcomponent templ.Component,
|
||||
) {
|
||||
<div id="contentlayout" hx-on::load={ AfterRequestContent() }>
|
||||
@listingcomponent
|
||||
@paginationcomponent
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSDashboardPat() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ JSDashboardPat() {
|
||||
<script>
|
||||
document.addEventListener(`DOMContentLoaded`, (event) => {
|
||||
const data = localStorage.getItem(`user`);
|
||||
if (data) {
|
||||
const parsedData = JSON.parse(data);
|
||||
// console.log(parsedData.M_UserEmail);
|
||||
document.getElementById('userEmail').value = parsedData.M_UserEmail;
|
||||
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
templ ShowDashboardPat(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,124 +1,124 @@
|
||||
package corporate_patient
|
||||
|
||||
import "cpone/component/modal"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ DialogReport(
|
||||
IDComponent string,
|
||||
postLink string,
|
||||
hxTarget string,
|
||||
hxSwap string,
|
||||
hxInclude string,
|
||||
modalID string,
|
||||
modalTitle string,
|
||||
modalBody templ.Component,
|
||||
modalClose templ.Component,
|
||||
) {
|
||||
<div class="">
|
||||
<div
|
||||
id={ IDComponent }
|
||||
hx-include={ hxInclude }
|
||||
>
|
||||
@modalcomponent.ModalViewXL(modalID,
|
||||
modalTitle,
|
||||
modalBody,
|
||||
modalClose,
|
||||
)
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ModalBody(
|
||||
IDComponent string,
|
||||
tabComponent templ.Component,
|
||||
hxOnLoad templ.ComponentScript,
|
||||
) {
|
||||
<div id={ IDComponent } hx-on::load={ hxOnLoad }>
|
||||
@tabComponent
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide');
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show');
|
||||
}
|
||||
|
||||
templ ModalClose(LinkClose string, hxTarget string, hxSwap string, modalID string) {
|
||||
<button
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ TabReportView(
|
||||
data []models.TabViewReportMcu,
|
||||
) {
|
||||
<div>
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
for i, v := range data {
|
||||
if i == 0 {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href={templ.URL("#kt_tab_pat_" + strconv.Itoa(i))}>{ v.Name }</a>
|
||||
</li>
|
||||
} else {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href={templ.URL("#kt_tab_pat_" + strconv.Itoa(i))}>{ v.Name }</a>
|
||||
</li>
|
||||
}
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="patTabContent">
|
||||
for i, v := range data {
|
||||
if i == 0 {
|
||||
<div class="tab-pane fade show active" id={"kt_tab_pat_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_pat_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
} else {
|
||||
<div class="tab-pane fade show" id={"kt_tab_pat_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_pat_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
// <div>
|
||||
// <ul class="nav nav-tabs nav-tabs-line">
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link active" data-toggle="tab" href="#kt_tab_pat_1">Hasil Lab</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pat_2">Hasil Non Lab</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pat_3">Hasil Fisik</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pat_4">Resume Individu</a>
|
||||
// </li>
|
||||
// </ul>
|
||||
// </div>
|
||||
// <div class="tab-content mt-5" id="patTabContent">
|
||||
// <div class="tab-pane fade show active" id="kt_tab_pat_1" role="tabpanel" aria-labelledby="kt_tab_pat_1" style="height: 700px;">
|
||||
// <object data={"https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_history.rptdesign&__format=pdf&PID=5&PPatientID=112&username=adhi&tm=1717726294764"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pat_2" role="tabpanel" aria-labelledby="kt_tab_pat_2" style="height: 700px;">
|
||||
// <object data={"https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/mcu_pajanan.rptdesign&__format=pdf&PID=5&PType=fisik&username=adhi&tm=1717726294764"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pat_3" role="tabpanel" aria-labelledby="kt_tab_pat_3" style="height: 700px;">
|
||||
// <object data={"https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/mcu_fisik.rptdesign&__format=pdf&PID=5&PType=fisik&username=adhi&tm=1717726294764"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pat_4" role="tabpanel" aria-labelledby="kt_tab_pat_4" style="height: 700px;">
|
||||
// <object data={"https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_resume.rptdesign&__format=pdf&PID=1&username=adhi&tm=1717726294764"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
package corporate_patient
|
||||
|
||||
import "cpone/component/modal"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ DialogReport(
|
||||
IDComponent string,
|
||||
postLink string,
|
||||
hxTarget string,
|
||||
hxSwap string,
|
||||
hxInclude string,
|
||||
modalID string,
|
||||
modalTitle string,
|
||||
modalBody templ.Component,
|
||||
modalClose templ.Component,
|
||||
) {
|
||||
<div class="">
|
||||
<div
|
||||
id={ IDComponent }
|
||||
hx-include={ hxInclude }
|
||||
>
|
||||
@modalcomponent.ModalViewXL(modalID,
|
||||
modalTitle,
|
||||
modalBody,
|
||||
modalClose,
|
||||
)
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ModalBody(
|
||||
IDComponent string,
|
||||
tabComponent templ.Component,
|
||||
hxOnLoad templ.ComponentScript,
|
||||
) {
|
||||
<div id={ IDComponent } hx-on::load={ hxOnLoad }>
|
||||
@tabComponent
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide');
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show');
|
||||
}
|
||||
|
||||
templ ModalClose(LinkClose string, hxTarget string, hxSwap string, modalID string) {
|
||||
<button
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ TabReportView(
|
||||
data []models.TabViewReportMcu,
|
||||
) {
|
||||
<div>
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
for i, v := range data {
|
||||
if i == 0 {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href={templ.URL("#kt_tab_pat_" + strconv.Itoa(i))}>{ v.Name }</a>
|
||||
</li>
|
||||
} else {
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href={templ.URL("#kt_tab_pat_" + strconv.Itoa(i))}>{ v.Name }</a>
|
||||
</li>
|
||||
}
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="patTabContent">
|
||||
for i, v := range data {
|
||||
if i == 0 {
|
||||
<div class="tab-pane fade show active" id={"kt_tab_pat_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_pat_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
} else {
|
||||
<div class="tab-pane fade show" id={"kt_tab_pat_" + strconv.Itoa(i)} role="tabpanel" aria-labelledby={"kt_tab_pat_" + strconv.Itoa(i)} style="height: 700px;">
|
||||
<object data={ v.Link } type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
// <div>
|
||||
// <ul class="nav nav-tabs nav-tabs-line">
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link active" data-toggle="tab" href="#kt_tab_pat_1">Hasil Lab</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pat_2">Hasil Non Lab</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pat_3">Hasil Fisik</a>
|
||||
// </li>
|
||||
// <li class="nav-item">
|
||||
// <a class="nav-link" data-toggle="tab" href="#kt_tab_pat_4">Resume Individu</a>
|
||||
// </li>
|
||||
// </ul>
|
||||
// </div>
|
||||
// <div class="tab-content mt-5" id="patTabContent">
|
||||
// <div class="tab-pane fade show active" id="kt_tab_pat_1" role="tabpanel" aria-labelledby="kt_tab_pat_1" style="height: 700px;">
|
||||
// <object data={"https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_history.rptdesign&__format=pdf&PID=5&PPatientID=112&username=adhi&tm=1717726294764"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pat_2" role="tabpanel" aria-labelledby="kt_tab_pat_2" style="height: 700px;">
|
||||
// <object data={"https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/mcu_pajanan.rptdesign&__format=pdf&PID=5&PType=fisik&username=adhi&tm=1717726294764"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pat_3" role="tabpanel" aria-labelledby="kt_tab_pat_3" style="height: 700px;">
|
||||
// <object data={"https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/mcu_fisik.rptdesign&__format=pdf&PID=5&PType=fisik&username=adhi&tm=1717726294764"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// <div class="tab-pane fade" id="kt_tab_pat_4" role="tabpanel" aria-labelledby="kt_tab_pat_4" style="height: 700px;">
|
||||
// <object data={"https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_resume.rptdesign&__format=pdf&PID=1&username=adhi&tm=1717726294764"} type="application/pdf" width="100%" height="100%"></object>
|
||||
// </div>
|
||||
// </div>
|
||||
@@ -1,121 +1,121 @@
|
||||
package employee
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/under_development"
|
||||
)
|
||||
|
||||
templ MainEmployee(cardServiceComponent templ.Component) {
|
||||
<div class="wrapper-custom">
|
||||
<!-- Navbar Start -->
|
||||
<nav
|
||||
class="navbar navbar-expand-sm navbar-expand-lg navbar-lp justify-content-between"
|
||||
>
|
||||
<a class="navbar-brand" href="#">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/logo.png"
|
||||
width="126"
|
||||
height="40"
|
||||
class="d-inline-block align-top"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</a>
|
||||
<img
|
||||
src="/asset-corporate-portal/media/logo/foto.png"
|
||||
alt="..."
|
||||
class="item-foto rounded-circle"
|
||||
/>
|
||||
</nav>
|
||||
<!-- Navbar End -->
|
||||
<div class="d-block d-lg-none d-xl-none">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
<div class="d-none d-lg-block">
|
||||
<!--begin::Page Heading-->
|
||||
@HeadingEmployee("PT. Sadhana Abiyasa Sampoerna")
|
||||
<!--end::Page Heading-->
|
||||
<!-- content -->
|
||||
<div class="align-items-center pt-15 flex-column">
|
||||
<div class="bg-field rounded">
|
||||
<div class="content-page">
|
||||
<!-- card -->
|
||||
@cardServiceComponent
|
||||
<!-- end card -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end content -->
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssEmployee() {
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
|
||||
.navbar-lp {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.title {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 15px;
|
||||
/* font-size: 1vw; */
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.custom-card-lp {
|
||||
border-radius: 24px;
|
||||
border: 1px solid #d9d9d9;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.wrapper-custom {
|
||||
/* background: #1B1D1F; */
|
||||
padding-left: 10vw;
|
||||
padding-right: 10vw;
|
||||
}
|
||||
|
||||
.media-left-icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.items-content {
|
||||
padding: 24px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.content-page {
|
||||
padding-top: 24px;
|
||||
padding-left: 24px;
|
||||
padding-right: 24px;
|
||||
padding-bottom: 24px;
|
||||
}
|
||||
.item-foto {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
.heading {
|
||||
padding-top: 40px;
|
||||
}
|
||||
.card:hover {
|
||||
background-color: rgba(197, 200, 211, 0.5);
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsEmployee() {
|
||||
}
|
||||
|
||||
templ ShowEmployee(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package employee
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/under_development"
|
||||
)
|
||||
|
||||
templ MainEmployee(cardServiceComponent templ.Component) {
|
||||
<div class="wrapper-custom">
|
||||
<!-- Navbar Start -->
|
||||
<nav
|
||||
class="navbar navbar-expand-sm navbar-expand-lg navbar-lp justify-content-between"
|
||||
>
|
||||
<a class="navbar-brand" href="#">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/logo.png"
|
||||
width="126"
|
||||
height="40"
|
||||
class="d-inline-block align-top"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</a>
|
||||
<img
|
||||
src="/asset-corporate-portal/media/logo/foto.png"
|
||||
alt="..."
|
||||
class="item-foto rounded-circle"
|
||||
/>
|
||||
</nav>
|
||||
<!-- Navbar End -->
|
||||
<div class="d-block d-lg-none d-xl-none">
|
||||
@under_development.UnderDevelopment()
|
||||
</div>
|
||||
<div class="d-none d-lg-block">
|
||||
<!--begin::Page Heading-->
|
||||
@HeadingEmployee("PT. Sadhana Abiyasa Sampoerna")
|
||||
<!--end::Page Heading-->
|
||||
<!-- content -->
|
||||
<div class="align-items-center pt-15 flex-column">
|
||||
<div class="bg-field rounded">
|
||||
<div class="content-page">
|
||||
<!-- card -->
|
||||
@cardServiceComponent
|
||||
<!-- end card -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end content -->
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssEmployee() {
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
|
||||
.navbar-lp {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.title {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 15px;
|
||||
/* font-size: 1vw; */
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.custom-card-lp {
|
||||
border-radius: 24px;
|
||||
border: 1px solid #d9d9d9;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.wrapper-custom {
|
||||
/* background: #1B1D1F; */
|
||||
padding-left: 10vw;
|
||||
padding-right: 10vw;
|
||||
}
|
||||
|
||||
.media-left-icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.items-content {
|
||||
padding: 24px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.content-page {
|
||||
padding-top: 24px;
|
||||
padding-left: 24px;
|
||||
padding-right: 24px;
|
||||
padding-bottom: 24px;
|
||||
}
|
||||
.item-foto {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
.heading {
|
||||
padding-top: 40px;
|
||||
}
|
||||
.card:hover {
|
||||
background-color: rgba(197, 200, 211, 0.5);
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsEmployee() {
|
||||
}
|
||||
|
||||
templ ShowEmployee(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,60 +1,60 @@
|
||||
package employee
|
||||
|
||||
import (
|
||||
services "cpone/services/dev"
|
||||
)
|
||||
|
||||
templ CardService(title string, description string, startdate string, enddate string) {
|
||||
<a href="">
|
||||
<div class="items-content card shadow">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-7">
|
||||
<h3 class="text-black">{ title }</h3>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolde">{ description }</span>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolde">{ startdate } - { enddate }</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
}
|
||||
|
||||
templ ListCardService(cardData []services.EmployeeService) {
|
||||
for _, d := range cardData {
|
||||
@CardService(d.EmployeeTitle, d.EmployeeDescription, d.EmployeeStartDate, d.EmployeeEndDate)
|
||||
}
|
||||
}
|
||||
|
||||
templ HeadingEmployee(title string) {
|
||||
<div class="heading d-flex justify-content-between">
|
||||
<div class="align-items-center flex-wrap">
|
||||
<!--begin::Page Title-->
|
||||
<h5 class="text-dark font-weight-bold my-1 mr-5">
|
||||
{ title }
|
||||
</h5>
|
||||
<!--end::Page Title-->
|
||||
<!--begin::Breadcrumb-->
|
||||
<ul
|
||||
class="breadcrumb breadcrumb-transparent font-weight-bold p-0 my-2 font-size-sm"
|
||||
>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="" class="text-muted">Dashboard</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="" class="text-muted">Employee Health Medical Analytic</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--end::Breadcrumb-->
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<!--begin::Actions-->
|
||||
<a href="#" class="btn btn-primary font-weight-bolder btn-lg">
|
||||
<i class="fas fa-filter"></i> Filter
|
||||
</a>
|
||||
<!--end::Actions-->
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
package employee
|
||||
|
||||
import (
|
||||
services "cpone/services/dev"
|
||||
)
|
||||
|
||||
templ CardService(title string, description string, startdate string, enddate string) {
|
||||
<a href="">
|
||||
<div class="items-content card shadow">
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-7">
|
||||
<h3 class="text-black">{ title }</h3>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolde">{ description }</span>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolde">{ startdate } - { enddate }</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
}
|
||||
|
||||
templ ListCardService(cardData []services.EmployeeService) {
|
||||
for _, d := range cardData {
|
||||
@CardService(d.EmployeeTitle, d.EmployeeDescription, d.EmployeeStartDate, d.EmployeeEndDate)
|
||||
}
|
||||
}
|
||||
|
||||
templ HeadingEmployee(title string) {
|
||||
<div class="heading d-flex justify-content-between">
|
||||
<div class="align-items-center flex-wrap">
|
||||
<!--begin::Page Title-->
|
||||
<h5 class="text-dark font-weight-bold my-1 mr-5">
|
||||
{ title }
|
||||
</h5>
|
||||
<!--end::Page Title-->
|
||||
<!--begin::Breadcrumb-->
|
||||
<ul
|
||||
class="breadcrumb breadcrumb-transparent font-weight-bold p-0 my-2 font-size-sm"
|
||||
>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="" class="text-muted">Dashboard</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="" class="text-muted">Employee Health Medical Analytic</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!--end::Breadcrumb-->
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<!--begin::Actions-->
|
||||
<a href="#" class="btn btn-primary font-weight-bolder btn-lg">
|
||||
<i class="fas fa-filter"></i> Filter
|
||||
</a>
|
||||
<!--end::Actions-->
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,181 +1,181 @@
|
||||
package dev_employeeanalytic
|
||||
|
||||
import "cpone/layout"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ EmployeeAnalyticScreen(
|
||||
listID string,
|
||||
paginationID string,
|
||||
breadcrumb templ.Component,
|
||||
filtercomponent templ.Component,
|
||||
listingcomponent templ.Component,
|
||||
paginationcomponent templ.Component,
|
||||
) {
|
||||
<div id="dashboardpicid" class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "listID",
|
||||
Name: "listID",
|
||||
Type: "hidden",
|
||||
Value: listID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
@filtercomponent
|
||||
<div id="loading-parent" class="rounded">
|
||||
@listingcomponent
|
||||
@paginationcomponent
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSEmployeeAnalytic() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JSEmployeeAnalytic() {
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
console.log("Before Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
console.log("After Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheError', function(event) {
|
||||
console.log("Error History Cache Error")
|
||||
console.log(event.detail.cause)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheMissError', function(event) {
|
||||
console.log("Error History Cache Miss Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.path)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:oobErrorNoTarget', function(event) {
|
||||
console.log("Error OOB No Target")
|
||||
console.log(event.detail.content)
|
||||
});
|
||||
document.addEventListener('htmx:onLoadError', function(event) {
|
||||
console.log("Error On Load")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.target)
|
||||
console.log(event.detail.exception)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:responseError', function(event) {
|
||||
console.log("Error Response")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sendError', function(event) {
|
||||
console.log("Error Send Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sseError', function(event) {
|
||||
console.log("Error Sse ")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.error)
|
||||
console.log(event.detail.source)
|
||||
});
|
||||
document.addEventListener('htmx:swapError', function(event) {
|
||||
console.log("Error Swap Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target Swap: "+event.detail.target)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:targetError', function(event) {
|
||||
console.log("Error target")
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target ID: "+event.detail.target)
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowEmployeeAnalytic(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
package dev_employeeanalytic
|
||||
|
||||
import "cpone/layout"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/models"
|
||||
|
||||
templ EmployeeAnalyticScreen(
|
||||
listID string,
|
||||
paginationID string,
|
||||
breadcrumb templ.Component,
|
||||
filtercomponent templ.Component,
|
||||
listingcomponent templ.Component,
|
||||
paginationcomponent templ.Component,
|
||||
) {
|
||||
<div id="dashboardpicid" class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "listID",
|
||||
Name: "listID",
|
||||
Type: "hidden",
|
||||
Value: listID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
@filtercomponent
|
||||
<div id="loading-parent" class="rounded">
|
||||
@listingcomponent
|
||||
@paginationcomponent
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSEmployeeAnalytic() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JSEmployeeAnalytic() {
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
console.log("Before Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
console.log("After Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheError', function(event) {
|
||||
console.log("Error History Cache Error")
|
||||
console.log(event.detail.cause)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheMissError', function(event) {
|
||||
console.log("Error History Cache Miss Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.path)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:oobErrorNoTarget', function(event) {
|
||||
console.log("Error OOB No Target")
|
||||
console.log(event.detail.content)
|
||||
});
|
||||
document.addEventListener('htmx:onLoadError', function(event) {
|
||||
console.log("Error On Load")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.target)
|
||||
console.log(event.detail.exception)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:responseError', function(event) {
|
||||
console.log("Error Response")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sendError', function(event) {
|
||||
console.log("Error Send Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sseError', function(event) {
|
||||
console.log("Error Sse ")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.error)
|
||||
console.log(event.detail.source)
|
||||
});
|
||||
document.addEventListener('htmx:swapError', function(event) {
|
||||
console.log("Error Swap Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target Swap: "+event.detail.target)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:targetError', function(event) {
|
||||
console.log("Error target")
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target ID: "+event.detail.target)
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowEmployeeAnalytic(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
@@ -1,68 +1,68 @@
|
||||
package dev_employeeanalytic
|
||||
|
||||
templ FilterListing(
|
||||
hxGet string,
|
||||
hxTrigger string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
hxTarget string,
|
||||
hxBeforeRequest templ.ComponentScript,
|
||||
hxAfterRequest templ.ComponentScript,
|
||||
) {
|
||||
<div class="row pt-8 align-items-center">
|
||||
<div class="col-12 col-sm-3 col-md-1 col-lg-1 col-xl-1 mb-2">
|
||||
<label class="text-black font-weight-bolder">Stard Date:</label>
|
||||
</div>
|
||||
<div class="col-12 col-sm-9 col-md-2 col-lg-2 col-xl-2 mb-2">
|
||||
<input
|
||||
id="startdateID"
|
||||
name="startdate"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="date"
|
||||
autocomplete="off"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3 col-md-1 col-lg-1 col-xl-1 mb-2">
|
||||
<label class="text-black font-weight-bolder">End Date:</label>
|
||||
</div>
|
||||
<div class="col-12 col-sm-9 col-md-2 col-lg-2 col-xl-2 mb-2">
|
||||
<input
|
||||
id="enddateID"
|
||||
name="enddate"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="date"
|
||||
autocomplete="off"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mb-2">
|
||||
<input
|
||||
id="searchID"
|
||||
name="search"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="text"
|
||||
placeholder="nama karyawan"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
package dev_employeeanalytic
|
||||
|
||||
templ FilterListing(
|
||||
hxGet string,
|
||||
hxTrigger string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
hxTarget string,
|
||||
hxBeforeRequest templ.ComponentScript,
|
||||
hxAfterRequest templ.ComponentScript,
|
||||
) {
|
||||
<div class="row pt-8 align-items-center">
|
||||
<div class="col-12 col-sm-3 col-md-1 col-lg-1 col-xl-1 mb-2">
|
||||
<label class="text-black font-weight-bolder">Stard Date:</label>
|
||||
</div>
|
||||
<div class="col-12 col-sm-9 col-md-2 col-lg-2 col-xl-2 mb-2">
|
||||
<input
|
||||
id="startdateID"
|
||||
name="startdate"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="date"
|
||||
autocomplete="off"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3 col-md-1 col-lg-1 col-xl-1 mb-2">
|
||||
<label class="text-black font-weight-bolder">End Date:</label>
|
||||
</div>
|
||||
<div class="col-12 col-sm-9 col-md-2 col-lg-2 col-xl-2 mb-2">
|
||||
<input
|
||||
id="enddateID"
|
||||
name="enddate"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="date"
|
||||
autocomplete="off"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mb-2">
|
||||
<input
|
||||
id="searchID"
|
||||
name="search"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="text"
|
||||
placeholder="nama karyawan"
|
||||
hx-get={ hxGet }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-swap={ hxSwap }
|
||||
hx-target={ hxTarget }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,41 +1,41 @@
|
||||
package dev_employeeanalytic
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ ListingData(
|
||||
data []models.DashboardPic,
|
||||
listID string,
|
||||
) {
|
||||
<div id={listID} class="align-items-center pt-8 flex-column" hx-swap-oob="true">
|
||||
<div class="bg-field rounded">
|
||||
<div class="p-8">
|
||||
for i, d := range data {
|
||||
if i == (len(data) - 1) {
|
||||
<div id={ strconv.Itoa(int(d.Mgm_McuID)) } class="card shadow p-8" hx-get={"/corp/dashboard_pic/click/" + strconv.Itoa(d.Mgm_McuID)}>
|
||||
@ItemCard(d)
|
||||
</div>
|
||||
} else {
|
||||
<div id={ strconv.Itoa(int(d.Mgm_McuID)) } class="card shadow p-8 mb-8" hx-get={"/corp/dashboard_pic/click/" + strconv.Itoa(d.Mgm_McuID)}>
|
||||
@ItemCard(d)
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemCard(data models.DashboardPic) {
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-7">
|
||||
<h3 class="text-black">{ data.Mgm_McuLabel }</h3>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolder">{ data.Mgm_McuNote }</span>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolder">{ data.Mgm_McuStartDate } - { data.Mgm_McuEndDate }</span>
|
||||
</div>
|
||||
</div>
|
||||
package dev_employeeanalytic
|
||||
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ ListingData(
|
||||
data []models.DashboardPic,
|
||||
listID string,
|
||||
) {
|
||||
<div id={listID} class="align-items-center pt-8 flex-column" hx-swap-oob="true">
|
||||
<div class="bg-field rounded">
|
||||
<div class="p-8">
|
||||
for i, d := range data {
|
||||
if i == (len(data) - 1) {
|
||||
<div id={ strconv.Itoa(int(d.Mgm_McuID)) } class="card shadow p-8" hx-get={"/corp/dashboard_pic/click/" + strconv.Itoa(d.Mgm_McuID)}>
|
||||
@ItemCard(d)
|
||||
</div>
|
||||
} else {
|
||||
<div id={ strconv.Itoa(int(d.Mgm_McuID)) } class="card shadow p-8 mb-8" hx-get={"/corp/dashboard_pic/click/" + strconv.Itoa(d.Mgm_McuID)}>
|
||||
@ItemCard(d)
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemCard(data models.DashboardPic) {
|
||||
<div class="row d-flex align-items-center">
|
||||
<div class="col-7">
|
||||
<h3 class="text-black">{ data.Mgm_McuLabel }</h3>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolder">{ data.Mgm_McuNote }</span>
|
||||
</div>
|
||||
<div class="col-md col-lg text-right">
|
||||
<span class="text-black font-weight-bolder">{ data.Mgm_McuStartDate } - { data.Mgm_McuEndDate }</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -1,388 +1,388 @@
|
||||
package groupresult
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/models"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
"cpone/component/table"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentGroupResultV1(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filter templ.Component,
|
||||
paginationGroupResult templ.Component,
|
||||
modaladdform templ.Component,
|
||||
modalEditform templ.Component,
|
||||
modalDeleteform templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filter
|
||||
// table content
|
||||
@tablecontent
|
||||
@paginationGroupResult
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border text-primary" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
// hx-on::after-request="showtoast()"
|
||||
// hx-on::reponse-error="cobaerror()"
|
||||
// hx-on::send-error="cobaerror()"
|
||||
@modaladdform
|
||||
@modalEditform
|
||||
@modalDeleteform
|
||||
// @modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSkuGroupResultV1()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRowGroupResultV1(data []models.GroupResult,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.Group_ResultName }</td>
|
||||
<td>{ v.Group_ResultFlagPerTest }</td>
|
||||
<td>{ v.Group_ResultFlagNonLab }</td>
|
||||
<td>{ v.Group_ResultResumeMcu }</td>
|
||||
<td>
|
||||
@TableAction(v.Group_ResultID, hxGetEdit, hxTargetEdit, hxSwapEdit, hxIncludeEdit, hxGetDelete, hxTargetDelete, hxSwapDelete, hxIncludeDelete)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
>
|
||||
// { "/dev/usergroupshoweditform?id=" + strconv.Itoa(v.M_UserGroupID) }
|
||||
// data-toggle="modal"
|
||||
// data-target={ "#dialogEdit" + strconv.Itoa(v.M_UserGroupID) }
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
id="btndeleteug"
|
||||
type="button"
|
||||
class=" btndeleteug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
>
|
||||
// hx-get={ "/dev/usergroupshowdeleteform?id=" + strconv.Itoa(v.M_UserGroupID) }
|
||||
// data-toggle="modal"
|
||||
// data-target={ "#dialogDelete" + strconv.Itoa(v.M_UserGroupID) }
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogDeleteGroupResultActionV1() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDeleteGroupResultV1() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSkuGroupResultV1() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
</script>
|
||||
}
|
||||
|
||||
templ CssMasterGroupResultV1x() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
.dropdown-menu{
|
||||
transform: translate3d(0px, 35px, 0px)!important;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
// for item dropdown
|
||||
templ ItemDropdown(dataDropdown []models.GroupResultResumeMcu, selectedId int) {
|
||||
if len(dataDropdown) == 0 {
|
||||
<option value="0" disabled selected>Tidak Ada Data</option>
|
||||
} else {
|
||||
for _, v := range dataDropdown {
|
||||
if (selectedId == v.ID) {
|
||||
<option value={ strconv.Itoa(v.ID) } selected>{ v.Text }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.ID) }>{ v.Text }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// for empty div
|
||||
templ EmptyDiv1() {
|
||||
<div></div>
|
||||
}
|
||||
|
||||
templ ShowGroupResultV1x(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
// table
|
||||
templ TableGroupResult(data []models.GroupResult, tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"GROUP RESULT NAME", "RESULT FLAG PER TEST", "RESULT FLAG NON LAB", "RESULT RESUME MCU", "AKSI"},
|
||||
[]string{"20%", "20%", "20%", "20%", "20%"},
|
||||
TableRowGroupResultV1(data, hxGetEdit, hxTargetEdit, hxSwapEdit, hxIncludeEdit, hxGetDelete, hxTargetDelete, hxSwapDelete, hxIncludeDelete))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ SwapTableGroupResult(pagination templ.Component, table templ.Component) {
|
||||
@pagination
|
||||
@table
|
||||
}
|
||||
|
||||
templ GroupResultForm(data models.GroupResultFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const boxes = document.querySelectorAll('.btnaddact');
|
||||
|
||||
for (let i = 0; i < boxes.length; i++) {
|
||||
boxes[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const boxes = document.querySelectorAll('.btnaddact');
|
||||
|
||||
for (let i = 0; i < boxes.length; i++) {
|
||||
boxes[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
package groupresult
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/models"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
"cpone/component/table"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentGroupResultV1(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filter templ.Component,
|
||||
paginationGroupResult templ.Component,
|
||||
modaladdform templ.Component,
|
||||
modalEditform templ.Component,
|
||||
modalDeleteform templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filter
|
||||
// table content
|
||||
@tablecontent
|
||||
@paginationGroupResult
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border text-primary" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
// hx-on::after-request="showtoast()"
|
||||
// hx-on::reponse-error="cobaerror()"
|
||||
// hx-on::send-error="cobaerror()"
|
||||
@modaladdform
|
||||
@modalEditform
|
||||
@modalDeleteform
|
||||
// @modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSkuGroupResultV1()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRowGroupResultV1(data []models.GroupResult,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.Group_ResultName }</td>
|
||||
<td>{ v.Group_ResultFlagPerTest }</td>
|
||||
<td>{ v.Group_ResultFlagNonLab }</td>
|
||||
<td>{ v.Group_ResultResumeMcu }</td>
|
||||
<td>
|
||||
@TableAction(v.Group_ResultID, hxGetEdit, hxTargetEdit, hxSwapEdit, hxIncludeEdit, hxGetDelete, hxTargetDelete, hxSwapDelete, hxIncludeDelete)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
>
|
||||
// { "/dev/usergroupshoweditform?id=" + strconv.Itoa(v.M_UserGroupID) }
|
||||
// data-toggle="modal"
|
||||
// data-target={ "#dialogEdit" + strconv.Itoa(v.M_UserGroupID) }
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
id="btndeleteug"
|
||||
type="button"
|
||||
class=" btndeleteug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
>
|
||||
// hx-get={ "/dev/usergroupshowdeleteform?id=" + strconv.Itoa(v.M_UserGroupID) }
|
||||
// data-toggle="modal"
|
||||
// data-target={ "#dialogDelete" + strconv.Itoa(v.M_UserGroupID) }
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogDeleteGroupResultActionV1() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDeleteGroupResultV1() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSkuGroupResultV1() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
</script>
|
||||
}
|
||||
|
||||
templ CssMasterGroupResultV1x() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
.dropdown-menu{
|
||||
transform: translate3d(0px, 35px, 0px)!important;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
// for item dropdown
|
||||
templ ItemDropdown(dataDropdown []models.GroupResultResumeMcu, selectedId int) {
|
||||
if len(dataDropdown) == 0 {
|
||||
<option value="0" disabled selected>Tidak Ada Data</option>
|
||||
} else {
|
||||
for _, v := range dataDropdown {
|
||||
if (selectedId == v.ID) {
|
||||
<option value={ strconv.Itoa(v.ID) } selected>{ v.Text }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.ID) }>{ v.Text }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// for empty div
|
||||
templ EmptyDiv1() {
|
||||
<div></div>
|
||||
}
|
||||
|
||||
templ ShowGroupResultV1x(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
// table
|
||||
templ TableGroupResult(data []models.GroupResult, tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"GROUP RESULT NAME", "RESULT FLAG PER TEST", "RESULT FLAG NON LAB", "RESULT RESUME MCU", "AKSI"},
|
||||
[]string{"20%", "20%", "20%", "20%", "20%"},
|
||||
TableRowGroupResultV1(data, hxGetEdit, hxTargetEdit, hxSwapEdit, hxIncludeEdit, hxGetDelete, hxTargetDelete, hxSwapDelete, hxIncludeDelete))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ SwapTableGroupResult(pagination templ.Component, table templ.Component) {
|
||||
@pagination
|
||||
@table
|
||||
}
|
||||
|
||||
templ GroupResultForm(data models.GroupResultFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const boxes = document.querySelectorAll('.btnaddact');
|
||||
|
||||
for (let i = 0; i < boxes.length; i++) {
|
||||
boxes[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const boxes = document.querySelectorAll('.btnaddact');
|
||||
|
||||
for (let i = 0; i < boxes.length; i++) {
|
||||
boxes[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,111 +1,111 @@
|
||||
package groupresult
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/component/customcheckbox"
|
||||
"cpone/component/customdropdown"
|
||||
)
|
||||
|
||||
templ DialogNewBodyV1(inputId models.CustomTextFieldv2Prm,
|
||||
inputGrName models.CustomTextFieldv2Prm,
|
||||
checkboxGrFlagPerTest models.CustomCheckboxv1Prm,
|
||||
checkboxGrFlagNonLab models.CustomCheckboxv1Prm,
|
||||
dropdownGrResumeMcu models.CustomDropdownv1Prm,
|
||||
listItem templ.Component,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputGrName)
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
checkboxGrFlagPerTest)
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
checkboxGrFlagNonLab)
|
||||
@customdropdown.MainCustomDropdownInput(
|
||||
dropdownGrResumeMcu,
|
||||
listItem)
|
||||
</div>
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script HandleJSModalAddGR(modalID string) {
|
||||
$(modalID).modal('hide');
|
||||
}
|
||||
|
||||
script HandleJSModalAddGRShow(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
}
|
||||
|
||||
templ DialogNewActionV1(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ HandleJSModalAddGR(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnaddact"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnaddact"
|
||||
>
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogNewAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseNew() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ BtnCloseNewV1(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ HandleJSModalAddGR(modalID) }
|
||||
class="close btnaddact"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
package groupresult
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/component/customcheckbox"
|
||||
"cpone/component/customdropdown"
|
||||
)
|
||||
|
||||
templ DialogNewBodyV1(inputId models.CustomTextFieldv2Prm,
|
||||
inputGrName models.CustomTextFieldv2Prm,
|
||||
checkboxGrFlagPerTest models.CustomCheckboxv1Prm,
|
||||
checkboxGrFlagNonLab models.CustomCheckboxv1Prm,
|
||||
dropdownGrResumeMcu models.CustomDropdownv1Prm,
|
||||
listItem templ.Component,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputGrName)
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
checkboxGrFlagPerTest)
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
checkboxGrFlagNonLab)
|
||||
@customdropdown.MainCustomDropdownInput(
|
||||
dropdownGrResumeMcu,
|
||||
listItem)
|
||||
</div>
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script HandleJSModalAddGR(modalID string) {
|
||||
$(modalID).modal('hide');
|
||||
}
|
||||
|
||||
script HandleJSModalAddGRShow(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
}
|
||||
|
||||
templ DialogNewActionV1(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ HandleJSModalAddGR(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnaddact"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnaddact"
|
||||
>
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogNewAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseNew() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ BtnCloseNewV1(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ HandleJSModalAddGR(modalID) }
|
||||
class="close btnaddact"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
@@ -1,101 +1,101 @@
|
||||
package groupresult
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/component/customcheckbox"
|
||||
"cpone/component/customdropdown"
|
||||
)
|
||||
|
||||
templ DialogEditForm(groupresultname string, groupresultflagpertest string, groupresultflagnonlab string, listItem templ.Component) {
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Group Result name",
|
||||
Name: "groupresultid",
|
||||
Placeholder: "Group Result name",
|
||||
Type: "hidden",
|
||||
ID: "groupresultid",
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Group Result Name",
|
||||
Name: "groupresultname",
|
||||
Placeholder: "Group Result Name",
|
||||
Value: groupresultname,
|
||||
Type: "text", ID: "groupresultname"})
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
models.CustomCheckboxv1Prm{
|
||||
Label: "Group Result Flag Per Test (Dicentang Maka Ya)",
|
||||
Name: "groupresultflagpertest",
|
||||
ID: "groupresultflagpertest",
|
||||
Value: groupresultflagpertest,
|
||||
})
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
models.CustomCheckboxv1Prm{
|
||||
Label: "Group Result Flag Non Lab (Dicentang Maka Ya)",
|
||||
Name: "groupresultflagnonlab",
|
||||
ID: "groupresultflagnonlab",
|
||||
Value: groupresultflagnonlab,
|
||||
})
|
||||
@customdropdown.MainCustomDropdownInput(
|
||||
models.CustomDropdownv1Prm{
|
||||
Label: "Group Result Resume MCU",
|
||||
Name: "groupresultresumemcu",
|
||||
ID: "groupresultresumemcu",
|
||||
},
|
||||
listItem)
|
||||
}
|
||||
|
||||
templ DialogEditBody(groupresultname string, groupresultflagpertest string, groupresultflagnonlab string, listItem templ.Component) {
|
||||
<div id="modalbdyEdit">
|
||||
@DialogEditForm(groupresultname, groupresultflagpertest, groupresultflagnonlab, listItem)
|
||||
</div>
|
||||
<div>
|
||||
// <div class="text-center text-primary" id="modalLoadEdit" style="">
|
||||
// <div class="spinner-border" role="status"></div>
|
||||
// </div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ LoadingSpinner() {
|
||||
<div id="modalbdyEdit">
|
||||
<div class="text-center text-primary">
|
||||
<div class="spinner-border" role="status"></div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogEditAction() {
|
||||
<div>
|
||||
<button
|
||||
id="btledit"
|
||||
type="button"
|
||||
hx-swap="delete"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseEdit() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
package groupresult
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/component/customcheckbox"
|
||||
"cpone/component/customdropdown"
|
||||
)
|
||||
|
||||
templ DialogEditForm(groupresultname string, groupresultflagpertest string, groupresultflagnonlab string, listItem templ.Component) {
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Group Result name",
|
||||
Name: "groupresultid",
|
||||
Placeholder: "Group Result name",
|
||||
Type: "hidden",
|
||||
ID: "groupresultid",
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Group Result Name",
|
||||
Name: "groupresultname",
|
||||
Placeholder: "Group Result Name",
|
||||
Value: groupresultname,
|
||||
Type: "text", ID: "groupresultname"})
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
models.CustomCheckboxv1Prm{
|
||||
Label: "Group Result Flag Per Test (Dicentang Maka Ya)",
|
||||
Name: "groupresultflagpertest",
|
||||
ID: "groupresultflagpertest",
|
||||
Value: groupresultflagpertest,
|
||||
})
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
models.CustomCheckboxv1Prm{
|
||||
Label: "Group Result Flag Non Lab (Dicentang Maka Ya)",
|
||||
Name: "groupresultflagnonlab",
|
||||
ID: "groupresultflagnonlab",
|
||||
Value: groupresultflagnonlab,
|
||||
})
|
||||
@customdropdown.MainCustomDropdownInput(
|
||||
models.CustomDropdownv1Prm{
|
||||
Label: "Group Result Resume MCU",
|
||||
Name: "groupresultresumemcu",
|
||||
ID: "groupresultresumemcu",
|
||||
},
|
||||
listItem)
|
||||
}
|
||||
|
||||
templ DialogEditBody(groupresultname string, groupresultflagpertest string, groupresultflagnonlab string, listItem templ.Component) {
|
||||
<div id="modalbdyEdit">
|
||||
@DialogEditForm(groupresultname, groupresultflagpertest, groupresultflagnonlab, listItem)
|
||||
</div>
|
||||
<div>
|
||||
// <div class="text-center text-primary" id="modalLoadEdit" style="">
|
||||
// <div class="spinner-border" role="status"></div>
|
||||
// </div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ LoadingSpinner() {
|
||||
<div id="modalbdyEdit">
|
||||
<div class="text-center text-primary">
|
||||
<div class="spinner-border" role="status"></div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogEditAction() {
|
||||
<div>
|
||||
<button
|
||||
id="btledit"
|
||||
type="button"
|
||||
hx-swap="delete"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseEdit() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
@@ -1,282 +1,282 @@
|
||||
package dev_kesimpulan
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ MainKesimpulan(
|
||||
tableID string,
|
||||
tablecontent templ.Component,
|
||||
tablecontentnonlab templ.Component,
|
||||
tablecontentfisik templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
<div class="d-flex justify-content-center pt-10 pb-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0">Kesimpulan</h2>
|
||||
</div>
|
||||
@tablecontent
|
||||
@tablecontentnonlab
|
||||
@tablecontentfisik
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssKesimpulan() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
#canvas {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
.breadcrumb {
|
||||
background-color: white;
|
||||
padding: 0px 0px !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
.breadcrumb-item a {
|
||||
color: #3f4254;
|
||||
font-family: Poppins;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 21px;
|
||||
}
|
||||
|
||||
.breadcrumb-item.active {
|
||||
color: #b5b5c3;
|
||||
font-family: Poppins;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 21px;
|
||||
}
|
||||
.nav-tabs {
|
||||
border-bottom: 0px solid #000000 !important;
|
||||
}
|
||||
.nav-link {
|
||||
color: #637381;
|
||||
font-family: Public Sans;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.nav-link.active {
|
||||
color: #212b36 !important; /* Warna teks untuk tab yang aktif */
|
||||
border-bottom: 2px solid #0c518c !important; /* Garis bawah untuk tab yang aktif */
|
||||
font-family: Public Sans;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
th {
|
||||
color: #637381;
|
||||
font-family: Roboto;
|
||||
font-weight: 700 !important;
|
||||
font-size: 14px !important;
|
||||
padding-bottom: 5px !important;
|
||||
padding-left: 1px !important;
|
||||
border-bottom: 1pt dashed #e4e6ef !important;
|
||||
}
|
||||
tr {
|
||||
border-bottom: 1pt dashed #e4e6ef !important;
|
||||
font-family: Roboto;
|
||||
}
|
||||
td {
|
||||
color: #0e1e28;
|
||||
font-family: Roboto;
|
||||
font-style: normal;
|
||||
font-weight: 500 !important;
|
||||
font-size: 16px !important;
|
||||
line-height: 30px; /* 187.5% */
|
||||
letter-spacing: -0.32px;
|
||||
padding-left: 1px !important;
|
||||
padding-top: 16px !important;
|
||||
padding-bottom: 16px !important;
|
||||
}
|
||||
thead {
|
||||
border-bottom: 1pt dashed #e4e6ef !important;
|
||||
}
|
||||
.kesimpulan-desc {
|
||||
color: #0e1e28;
|
||||
font-family: Roboto;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
letter-spacing: -0.24px;
|
||||
}
|
||||
.label-text {
|
||||
background-color: grey;
|
||||
color: black;
|
||||
padding: 5px 20px 5px 20px !important;
|
||||
border-radius: 6px;
|
||||
font-family: Poppins !important;
|
||||
font-size: 11px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 500 !important;
|
||||
line-height: normal !important;
|
||||
}
|
||||
.label-text.fit {
|
||||
background: #c9f7f5;
|
||||
color: #1bc5bd;
|
||||
padding: 5px 20px 5px 20px !important;
|
||||
border-radius: 6px;
|
||||
font-family: Poppins !important;
|
||||
font-size: 11px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 500 !important;
|
||||
line-height: normal !important;
|
||||
}
|
||||
.label-text.unfit {
|
||||
background: #fff4de;
|
||||
color: #ffa800;
|
||||
padding: 5px 20px 5px 20px !important;
|
||||
border-radius: 6px;
|
||||
font-family: Poppins !important;
|
||||
font-size: 11px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 500 !important;
|
||||
line-height: normal !important;
|
||||
}
|
||||
|
||||
.iconify-btn {
|
||||
color: #637381 !important;
|
||||
width: 23px !important;
|
||||
height: 23px !important;
|
||||
margin-right: 1em;
|
||||
}
|
||||
.iconify-btn-blue {
|
||||
color: #0c518c !important;
|
||||
width: 23px !important;
|
||||
height: 23px !important;
|
||||
margin-right: 1em;
|
||||
}
|
||||
.modal-header {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
.modal-title {
|
||||
font-family: "Public Sans" !important;
|
||||
font-size: 18px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 700 !important;
|
||||
line-height: 28px !important;
|
||||
}
|
||||
.modal-dialog {
|
||||
border-radius: 8px;
|
||||
}
|
||||
.btn-print {
|
||||
border-radius: 6px !important;
|
||||
background-color: #f5f8fa !important;
|
||||
font-family: Roboto;
|
||||
font-size: 14px;
|
||||
margin-bottom: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.modal-xl {
|
||||
border-radius: 6px !important;
|
||||
max-width: 90vw !important;
|
||||
max-height: 95vh !important;
|
||||
width: 90vw !important;
|
||||
height: 95vh !important;
|
||||
}
|
||||
.header-print {
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
.modal-print-title {
|
||||
color: #000;
|
||||
font-family: "Open Sans";
|
||||
font-size: 28px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.close-print {
|
||||
color: red !important;
|
||||
width: 30px !important;
|
||||
height: 30px !important;
|
||||
}
|
||||
.form-label {
|
||||
font-family: Poppins !important;
|
||||
font-size: 14px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 600 !important;
|
||||
line-height: 24px !important; /* 171.429% */
|
||||
}
|
||||
.form-input {
|
||||
font-family: Poppins !important;
|
||||
font-size: 16px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 400 !important;
|
||||
line-height: 24px !important;
|
||||
}
|
||||
.btn-text {
|
||||
font-family: "Public Sans";
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 24px;
|
||||
}
|
||||
.dot-text {
|
||||
position: relative;
|
||||
padding-left: 1.5em; /* Menambahkan padding untuk memberi ruang pada titik */
|
||||
}
|
||||
|
||||
.dot-text::before {
|
||||
content: "•"; /* Menambahkan titik di depan teks */
|
||||
position: absolute;
|
||||
left: 1em; /* Atur posisi titik */
|
||||
top: 0;
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.information-title {
|
||||
color: #0e1e28;
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsKesimpulan() {
|
||||
}
|
||||
|
||||
templ ShowKesimpulan(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package dev_kesimpulan
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ MainKesimpulan(
|
||||
tableID string,
|
||||
tablecontent templ.Component,
|
||||
tablecontentnonlab templ.Component,
|
||||
tablecontentfisik templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
<div class="d-flex justify-content-center pt-10 pb-10">
|
||||
<h2 class="title text-black" style="margin-bottom: 0">Kesimpulan</h2>
|
||||
</div>
|
||||
@tablecontent
|
||||
@tablecontentnonlab
|
||||
@tablecontentfisik
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssKesimpulan() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
#canvas {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
.breadcrumb {
|
||||
background-color: white;
|
||||
padding: 0px 0px !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
.breadcrumb-item a {
|
||||
color: #3f4254;
|
||||
font-family: Poppins;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 21px;
|
||||
}
|
||||
|
||||
.breadcrumb-item.active {
|
||||
color: #b5b5c3;
|
||||
font-family: Poppins;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 21px;
|
||||
}
|
||||
.nav-tabs {
|
||||
border-bottom: 0px solid #000000 !important;
|
||||
}
|
||||
.nav-link {
|
||||
color: #637381;
|
||||
font-family: Public Sans;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.nav-link.active {
|
||||
color: #212b36 !important; /* Warna teks untuk tab yang aktif */
|
||||
border-bottom: 2px solid #0c518c !important; /* Garis bawah untuk tab yang aktif */
|
||||
font-family: Public Sans;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
th {
|
||||
color: #637381;
|
||||
font-family: Roboto;
|
||||
font-weight: 700 !important;
|
||||
font-size: 14px !important;
|
||||
padding-bottom: 5px !important;
|
||||
padding-left: 1px !important;
|
||||
border-bottom: 1pt dashed #e4e6ef !important;
|
||||
}
|
||||
tr {
|
||||
border-bottom: 1pt dashed #e4e6ef !important;
|
||||
font-family: Roboto;
|
||||
}
|
||||
td {
|
||||
color: #0e1e28;
|
||||
font-family: Roboto;
|
||||
font-style: normal;
|
||||
font-weight: 500 !important;
|
||||
font-size: 16px !important;
|
||||
line-height: 30px; /* 187.5% */
|
||||
letter-spacing: -0.32px;
|
||||
padding-left: 1px !important;
|
||||
padding-top: 16px !important;
|
||||
padding-bottom: 16px !important;
|
||||
}
|
||||
thead {
|
||||
border-bottom: 1pt dashed #e4e6ef !important;
|
||||
}
|
||||
.kesimpulan-desc {
|
||||
color: #0e1e28;
|
||||
font-family: Roboto;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
letter-spacing: -0.24px;
|
||||
}
|
||||
.label-text {
|
||||
background-color: grey;
|
||||
color: black;
|
||||
padding: 5px 20px 5px 20px !important;
|
||||
border-radius: 6px;
|
||||
font-family: Poppins !important;
|
||||
font-size: 11px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 500 !important;
|
||||
line-height: normal !important;
|
||||
}
|
||||
.label-text.fit {
|
||||
background: #c9f7f5;
|
||||
color: #1bc5bd;
|
||||
padding: 5px 20px 5px 20px !important;
|
||||
border-radius: 6px;
|
||||
font-family: Poppins !important;
|
||||
font-size: 11px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 500 !important;
|
||||
line-height: normal !important;
|
||||
}
|
||||
.label-text.unfit {
|
||||
background: #fff4de;
|
||||
color: #ffa800;
|
||||
padding: 5px 20px 5px 20px !important;
|
||||
border-radius: 6px;
|
||||
font-family: Poppins !important;
|
||||
font-size: 11px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 500 !important;
|
||||
line-height: normal !important;
|
||||
}
|
||||
|
||||
.iconify-btn {
|
||||
color: #637381 !important;
|
||||
width: 23px !important;
|
||||
height: 23px !important;
|
||||
margin-right: 1em;
|
||||
}
|
||||
.iconify-btn-blue {
|
||||
color: #0c518c !important;
|
||||
width: 23px !important;
|
||||
height: 23px !important;
|
||||
margin-right: 1em;
|
||||
}
|
||||
.modal-header {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
.modal-title {
|
||||
font-family: "Public Sans" !important;
|
||||
font-size: 18px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 700 !important;
|
||||
line-height: 28px !important;
|
||||
}
|
||||
.modal-dialog {
|
||||
border-radius: 8px;
|
||||
}
|
||||
.btn-print {
|
||||
border-radius: 6px !important;
|
||||
background-color: #f5f8fa !important;
|
||||
font-family: Roboto;
|
||||
font-size: 14px;
|
||||
margin-bottom: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.modal-xl {
|
||||
border-radius: 6px !important;
|
||||
max-width: 90vw !important;
|
||||
max-height: 95vh !important;
|
||||
width: 90vw !important;
|
||||
height: 95vh !important;
|
||||
}
|
||||
.header-print {
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
.modal-print-title {
|
||||
color: #000;
|
||||
font-family: "Open Sans";
|
||||
font-size: 28px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.close-print {
|
||||
color: red !important;
|
||||
width: 30px !important;
|
||||
height: 30px !important;
|
||||
}
|
||||
.form-label {
|
||||
font-family: Poppins !important;
|
||||
font-size: 14px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 600 !important;
|
||||
line-height: 24px !important; /* 171.429% */
|
||||
}
|
||||
.form-input {
|
||||
font-family: Poppins !important;
|
||||
font-size: 16px !important;
|
||||
font-style: normal !important;
|
||||
font-weight: 400 !important;
|
||||
line-height: 24px !important;
|
||||
}
|
||||
.btn-text {
|
||||
font-family: "Public Sans";
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: 24px;
|
||||
}
|
||||
.dot-text {
|
||||
position: relative;
|
||||
padding-left: 1.5em; /* Menambahkan padding untuk memberi ruang pada titik */
|
||||
}
|
||||
|
||||
.dot-text::before {
|
||||
content: "•"; /* Menambahkan titik di depan teks */
|
||||
position: absolute;
|
||||
left: 1em; /* Atur posisi titik */
|
||||
top: 0;
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.information-title {
|
||||
color: #0e1e28;
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsKesimpulan() {
|
||||
}
|
||||
|
||||
templ ShowKesimpulan(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,46 +1,46 @@
|
||||
package dev_kesimpulan
|
||||
|
||||
import (
|
||||
"cpone/component/table"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ CardTableKesimpulan(title string, data []models.ModelKesimpulanLab, tableID string) {
|
||||
<div class="card card-custom gutter-b" style="border-radius: 20px">
|
||||
<div style="padding-top: 12px">
|
||||
<h3 class="card-label dot-text text-black">
|
||||
{ title }
|
||||
</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div>
|
||||
@TableKesimpulan(data, tableID)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableKesimpulan(data []models.ModelKesimpulanLab,
|
||||
tableID string) {
|
||||
<div id={ tableID }>
|
||||
@tablecomponent.TableV3([]string{"NO", "PEMERIKSAAN", "PERSENTASE"},
|
||||
[]string{"5%", "70%", "25%"},
|
||||
RowKesimpulan(data),
|
||||
)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowKesimpulan(data []models.ModelKesimpulanLab) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.Nomor }</td>
|
||||
<td>{ v.Test }</td>
|
||||
<td>{ v.Total }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
package dev_kesimpulan
|
||||
|
||||
import (
|
||||
"cpone/component/table"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ CardTableKesimpulan(title string, data []models.ModelKesimpulanLab, tableID string) {
|
||||
<div class="card card-custom gutter-b" style="border-radius: 20px">
|
||||
<div style="padding-top: 12px">
|
||||
<h3 class="card-label dot-text text-black">
|
||||
{ title }
|
||||
</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div>
|
||||
@TableKesimpulan(data, tableID)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableKesimpulan(data []models.ModelKesimpulanLab,
|
||||
tableID string) {
|
||||
<div id={ tableID }>
|
||||
@tablecomponent.TableV3([]string{"NO", "PEMERIKSAAN", "PERSENTASE"},
|
||||
[]string{"5%", "70%", "25%"},
|
||||
RowKesimpulan(data),
|
||||
)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowKesimpulan(data []models.ModelKesimpulanLab) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.Nomor }</td>
|
||||
<td>{ v.Test }</td>
|
||||
<td>{ v.Total }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,131 +1,131 @@
|
||||
package landingpage
|
||||
|
||||
import (
|
||||
services "cpone/services/dev"
|
||||
)
|
||||
|
||||
templ FooterContact() {
|
||||
<div class="text-white d-flex flex-row mb-3">
|
||||
<!-- style="display: flex; flex-direction: row; color: white;align-items: start; margin-bottom: 24px;" -->
|
||||
<div class="mr-3 mt-1">
|
||||
<i
|
||||
class="fas fa-map-marker-alt marker footer-icon text-warning"
|
||||
></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
// <p class="footer-sub-title text-grey">
|
||||
// { alamat }
|
||||
// </p>
|
||||
<p class="footer-sub-title text-grey">
|
||||
Jl. Cipaku I No.5, RT.2/RW.4, Petogogan, Kec. Kby. Baru, Kota
|
||||
Jakarta Selatan, Daerah Khusus Ibukota Jakarta 12170
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex flex-row">
|
||||
<div class="mr-3 mt-1">
|
||||
<i class="fas fa-phone footer-icon text-warning"></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
// for _, d := range phone {
|
||||
// <p class="footer-sub-title text-grey">{ d }</p>
|
||||
// }
|
||||
<p class="footer-sub-title text-grey">021-7392345</p>
|
||||
<p class="footer-sub-title text-grey">021-2702525</p>
|
||||
<p class="footer-sub-title text-grey">021-7255080</p>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ FooterNav(title string, data []services.FooterSubNav) {
|
||||
<div class="col-md col-lg mb-5">
|
||||
<h4 class="footer-title text-white mb-6">{ title }</h4>
|
||||
for _, d := range data {
|
||||
<div>
|
||||
<a class="footer-sub-title text-grey" href={ templ.SafeURL(d.FootSubNavLink) }>{ d.FootSubNavTitle }</a>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ FooterSection(navlist []services.FooterNav) {
|
||||
<footer class="wrapper-custom bg-black pb-25 pt-25 mt-25">
|
||||
// HP
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md col-lg">
|
||||
<img
|
||||
src="asset-corporate-portal/media/landingpage/logo.png"
|
||||
class="logo-footer"
|
||||
width="126"
|
||||
height="40"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
@FooterContact()
|
||||
</div>
|
||||
<div class="mt-5">
|
||||
for _, d := range navlist {
|
||||
@FooterNav(d.FooterNavTitle, d.FooteSubNav)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End HP
|
||||
// Tablet
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md col-lg">
|
||||
<img
|
||||
src="asset-corporate-portal/media/landingpage/logo.png"
|
||||
class="logo-footer"
|
||||
width="126"
|
||||
height="40"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
@FooterContact()
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
for _, d := range navlist {
|
||||
@FooterNav(d.FooterNavTitle, d.FooteSubNav)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End Tablet
|
||||
// Dekstop
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md-12 col-lg">
|
||||
<img
|
||||
src="asset-corporate-portal/media/landingpage/logo.png"
|
||||
class="logo-footer"
|
||||
width="126"
|
||||
height="40"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
@FooterContact()
|
||||
</div>
|
||||
for _, d := range navlist {
|
||||
@FooterNav(d.FooterNavTitle, d.FooteSubNav)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
// End Dekstop
|
||||
<div class="garis bg-grey"></div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-6">
|
||||
<p class="footer-sub-title text-grey">
|
||||
© Copyright 2024. Organized PT SADHANA ABIYASA SAMPOERNA (Privacy
|
||||
Policy)
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-6 text-right">
|
||||
<p class="footer-icons">
|
||||
<a href="#" class="mr-3"><i class="fab fa-whatsapp"></i></a>
|
||||
<a href="#" class="mr-3"><i class="fab fa-facebook"></i></a>
|
||||
<a href="#"><i class="fab fa-instagram"></i></a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
}
|
||||
package landingpage
|
||||
|
||||
import (
|
||||
services "cpone/services/dev"
|
||||
)
|
||||
|
||||
templ FooterContact() {
|
||||
<div class="text-white d-flex flex-row mb-3">
|
||||
<!-- style="display: flex; flex-direction: row; color: white;align-items: start; margin-bottom: 24px;" -->
|
||||
<div class="mr-3 mt-1">
|
||||
<i
|
||||
class="fas fa-map-marker-alt marker footer-icon text-warning"
|
||||
></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
// <p class="footer-sub-title text-grey">
|
||||
// { alamat }
|
||||
// </p>
|
||||
<p class="footer-sub-title text-grey">
|
||||
Jl. Cipaku I No.5, RT.2/RW.4, Petogogan, Kec. Kby. Baru, Kota
|
||||
Jakarta Selatan, Daerah Khusus Ibukota Jakarta 12170
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex flex-row">
|
||||
<div class="mr-3 mt-1">
|
||||
<i class="fas fa-phone footer-icon text-warning"></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
// for _, d := range phone {
|
||||
// <p class="footer-sub-title text-grey">{ d }</p>
|
||||
// }
|
||||
<p class="footer-sub-title text-grey">021-7392345</p>
|
||||
<p class="footer-sub-title text-grey">021-2702525</p>
|
||||
<p class="footer-sub-title text-grey">021-7255080</p>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ FooterNav(title string, data []services.FooterSubNav) {
|
||||
<div class="col-md col-lg mb-5">
|
||||
<h4 class="footer-title text-white mb-6">{ title }</h4>
|
||||
for _, d := range data {
|
||||
<div>
|
||||
<a class="footer-sub-title text-grey" href={ templ.SafeURL(d.FootSubNavLink) }>{ d.FootSubNavTitle }</a>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ FooterSection(navlist []services.FooterNav) {
|
||||
<footer class="wrapper-custom bg-black pb-25 pt-25 mt-25">
|
||||
// HP
|
||||
<div class="d-xs-block d-sm-block d-md-none">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md col-lg">
|
||||
<img
|
||||
src="asset-corporate-portal/media/landingpage/logo.png"
|
||||
class="logo-footer"
|
||||
width="126"
|
||||
height="40"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
@FooterContact()
|
||||
</div>
|
||||
<div class="mt-5">
|
||||
for _, d := range navlist {
|
||||
@FooterNav(d.FooterNavTitle, d.FooteSubNav)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End HP
|
||||
// Tablet
|
||||
<div class="d-none d-md-block d-lg-none">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md col-lg">
|
||||
<img
|
||||
src="asset-corporate-portal/media/landingpage/logo.png"
|
||||
class="logo-footer"
|
||||
width="126"
|
||||
height="40"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
@FooterContact()
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
for _, d := range navlist {
|
||||
@FooterNav(d.FooterNavTitle, d.FooteSubNav)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End Tablet
|
||||
// Dekstop
|
||||
<div class="d-none d-lg-block">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md-12 col-lg">
|
||||
<img
|
||||
src="asset-corporate-portal/media/landingpage/logo.png"
|
||||
class="logo-footer"
|
||||
width="126"
|
||||
height="40"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
@FooterContact()
|
||||
</div>
|
||||
for _, d := range navlist {
|
||||
@FooterNav(d.FooterNavTitle, d.FooteSubNav)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
// End Dekstop
|
||||
<div class="garis bg-grey"></div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-6">
|
||||
<p class="footer-sub-title text-grey">
|
||||
© Copyright 2024. Organized PT SADHANA ABIYASA SAMPOERNA (Privacy
|
||||
Policy)
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-6 text-right">
|
||||
<p class="footer-icons">
|
||||
<a href="#" class="mr-3"><i class="fab fa-whatsapp"></i></a>
|
||||
<a href="#" class="mr-3"><i class="fab fa-facebook"></i></a>
|
||||
<a href="#"><i class="fab fa-instagram"></i></a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
}
|
||||
|
||||
@@ -1,331 +1,331 @@
|
||||
package landingpage
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ MainLandingPage(medicalServiceComponent templ.Component, listAdvantageComponent templ.Component, listPromotion templ.Component, footer templ.Component) {
|
||||
<div class="wrapper-custom mb-25">
|
||||
<!-- Navbar Start -->
|
||||
<nav
|
||||
class="navbar navbar-expand-sm navbar-expand-lg navbar-lp justify-content-between"
|
||||
>
|
||||
<a class="navbar-brand" href="#">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/logo.png"
|
||||
width="126"
|
||||
height="40"
|
||||
class="d-inline-block align-top"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</a>
|
||||
<button type="button" class="btn btn-lg btn-primary btn-pill">
|
||||
<span class="title">Login</span>
|
||||
</button>
|
||||
</nav>
|
||||
<!-- Navbar End -->
|
||||
<!-- jumbotron START -->
|
||||
<!-- <div class="jumbotron jumbotron-lp d-none d-lg-block"> -->
|
||||
@HeaderCard()
|
||||
<!-- jumbotron END -->
|
||||
<!-- Our Medical Service START -->
|
||||
<div class="row">
|
||||
@HeaderSection("Our Medical Services", "Discover excellence in healthcare at Our Medical Services. From diagnosis to treatment, our dedicated team provides personalized care for your well-being.")
|
||||
</div>
|
||||
@medicalServiceComponent
|
||||
<!-- Our Medical Service END -->
|
||||
<!-- Why Westerindo START belum fix di ukuran < 1400 -->
|
||||
<div class="container p-0 mt-5 ">
|
||||
<div class="row">
|
||||
@HeaderSection("Why Westerindo", "With a dedicated team of professionals we’re committed to providing medical attention tailored to your needs, ensuring a journey to optimal health and vitality.")
|
||||
</div>
|
||||
@listAdvantageComponent
|
||||
</div>
|
||||
<!-- Why Westerindo END -->
|
||||
<!-- Promotion START -->
|
||||
<div class="container mt-4">
|
||||
<div class="row">
|
||||
@HeaderSection("Promotions", "Seize This Opportunity to Enhance Your Health")
|
||||
</div>
|
||||
@listPromotion
|
||||
</div>
|
||||
<!-- Promotion END -->
|
||||
<!-- footer START -->
|
||||
@footer
|
||||
<!-- footer END -->
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssLandingPage() {
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
|
||||
.navbar-lp {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.jumbotron-lp {
|
||||
border-radius: 32px;
|
||||
/* background: #3B4F9F; */
|
||||
}
|
||||
|
||||
.title {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 15px;
|
||||
/* font-size: 1vw; */
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.title-jumbotron-sm {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 32px;
|
||||
/* font-size: 3vw; */
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.title-jumbotron-md {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 42px;
|
||||
/* font-size: 3vw; */
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.title-jumbotron {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 52px;
|
||||
/* font-size: 3vw; */
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.sub-title-jumbotron {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 16px;
|
||||
/* font-size: 1vw; */
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.btn-login {
|
||||
border-radius: 40px;
|
||||
/* background-color: #3B4F9F; */
|
||||
box-shadow: 0px 8px 16px 0px rgba(59, 79, 159, 0.24);
|
||||
}
|
||||
|
||||
.title-get-started {
|
||||
/* color: #0C518C; */
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
/* font-size: 1vw; */
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.custom-button-get-started {
|
||||
border-radius: 40px;
|
||||
/* background-color: #FFF; */
|
||||
box-shadow: 0px 8px 16px 0px rgba(12, 81, 140, 0.24);
|
||||
padding: 20px;
|
||||
margin-top: 44px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 242px;
|
||||
}
|
||||
|
||||
.title-section {
|
||||
/* color: #000; */
|
||||
font-family: Poppins;
|
||||
font-size: 40px;
|
||||
/* font-size: 3vw; */
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: 80px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.sub-title-section {
|
||||
/* color: #212B36; */
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
/* font-size: 1.5vw; */
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
.custom-card-lp {
|
||||
border-radius: 24px;
|
||||
border: 1px solid #d9d9d9;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.title-fs-20 {
|
||||
/* color: #0E1E28; */
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
/* font-size: 1.5vw; */
|
||||
font-style: normal;
|
||||
/* font-weight: 500; */
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
.sub-title-fs-12 {
|
||||
/* color: #0E1E28; */
|
||||
font-family: Poppins;
|
||||
font-size: 12px;
|
||||
/* font-size: 0.9vw; */
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.icon-container {
|
||||
display: inline-block;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 16px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.link-learn-more {
|
||||
/* color: #3B4F9F; */
|
||||
font-family: Poppins;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.wrapper-custom {
|
||||
/* background: #1B1D1F; */
|
||||
padding-left: 10vw;
|
||||
padding-right: 10vw;
|
||||
}
|
||||
|
||||
.media-left-icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.footer-title {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.footer-sub-title {
|
||||
/* color: #C3C4C5; */
|
||||
font-family: Poppins;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.logo-footer {
|
||||
margin-bottom: 24px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.garis {
|
||||
/* background: #C3C4C5; */
|
||||
height: 0.2px;
|
||||
}
|
||||
.card-footer {
|
||||
background-color: transparent !important;
|
||||
border: none;
|
||||
}
|
||||
.slick-prev:before,
|
||||
.slick-next:before {
|
||||
color: var(--primarybg);
|
||||
}
|
||||
.img-header {
|
||||
object-fit: contain;
|
||||
}
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsLandingPage() {
|
||||
<!-- SCRIPT -->
|
||||
<script type="text/javascript" src="assets/js/slick/slick.min.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
// lg
|
||||
$(".responsive-lg").slick({
|
||||
dots: false,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 2000,
|
||||
infinite: true,
|
||||
lazyLoad: "ondemand",
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
nextArrow: '<button type="button" class="slick-next">Next</button>',
|
||||
prevArrow:
|
||||
'<button type="button" class="slick-prev">Previous</button>',
|
||||
});
|
||||
|
||||
// md
|
||||
$(".responsive-md").slick({
|
||||
dots: false,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 2000,
|
||||
infinite: true,
|
||||
lazyLoad: "ondemand",
|
||||
slidesToShow: 2,
|
||||
slidesToScroll: 2,
|
||||
});
|
||||
|
||||
// sm
|
||||
$(".responsive-sm").slick({
|
||||
dots: false,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 2000,
|
||||
infinite: true,
|
||||
lazyLoad: "ondemand",
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<!-- SCRIPT -->
|
||||
}
|
||||
|
||||
templ ShowLandingPage(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package landingpage
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ MainLandingPage(medicalServiceComponent templ.Component, listAdvantageComponent templ.Component, listPromotion templ.Component, footer templ.Component) {
|
||||
<div class="wrapper-custom mb-25">
|
||||
<!-- Navbar Start -->
|
||||
<nav
|
||||
class="navbar navbar-expand-sm navbar-expand-lg navbar-lp justify-content-between"
|
||||
>
|
||||
<a class="navbar-brand" href="#">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/logo.png"
|
||||
width="126"
|
||||
height="40"
|
||||
class="d-inline-block align-top"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</a>
|
||||
<button type="button" class="btn btn-lg btn-primary btn-pill">
|
||||
<span class="title">Login</span>
|
||||
</button>
|
||||
</nav>
|
||||
<!-- Navbar End -->
|
||||
<!-- jumbotron START -->
|
||||
<!-- <div class="jumbotron jumbotron-lp d-none d-lg-block"> -->
|
||||
@HeaderCard()
|
||||
<!-- jumbotron END -->
|
||||
<!-- Our Medical Service START -->
|
||||
<div class="row">
|
||||
@HeaderSection("Our Medical Services", "Discover excellence in healthcare at Our Medical Services. From diagnosis to treatment, our dedicated team provides personalized care for your well-being.")
|
||||
</div>
|
||||
@medicalServiceComponent
|
||||
<!-- Our Medical Service END -->
|
||||
<!-- Why Westerindo START belum fix di ukuran < 1400 -->
|
||||
<div class="container p-0 mt-5 ">
|
||||
<div class="row">
|
||||
@HeaderSection("Why Westerindo", "With a dedicated team of professionals we’re committed to providing medical attention tailored to your needs, ensuring a journey to optimal health and vitality.")
|
||||
</div>
|
||||
@listAdvantageComponent
|
||||
</div>
|
||||
<!-- Why Westerindo END -->
|
||||
<!-- Promotion START -->
|
||||
<div class="container mt-4">
|
||||
<div class="row">
|
||||
@HeaderSection("Promotions", "Seize This Opportunity to Enhance Your Health")
|
||||
</div>
|
||||
@listPromotion
|
||||
</div>
|
||||
<!-- Promotion END -->
|
||||
<!-- footer START -->
|
||||
@footer
|
||||
<!-- footer END -->
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssLandingPage() {
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
|
||||
.navbar-lp {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.jumbotron-lp {
|
||||
border-radius: 32px;
|
||||
/* background: #3B4F9F; */
|
||||
}
|
||||
|
||||
.title {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 15px;
|
||||
/* font-size: 1vw; */
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.title-jumbotron-sm {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 32px;
|
||||
/* font-size: 3vw; */
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.title-jumbotron-md {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 42px;
|
||||
/* font-size: 3vw; */
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.title-jumbotron {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 52px;
|
||||
/* font-size: 3vw; */
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.sub-title-jumbotron {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 16px;
|
||||
/* font-size: 1vw; */
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.btn-login {
|
||||
border-radius: 40px;
|
||||
/* background-color: #3B4F9F; */
|
||||
box-shadow: 0px 8px 16px 0px rgba(59, 79, 159, 0.24);
|
||||
}
|
||||
|
||||
.title-get-started {
|
||||
/* color: #0C518C; */
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
/* font-size: 1vw; */
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.custom-button-get-started {
|
||||
border-radius: 40px;
|
||||
/* background-color: #FFF; */
|
||||
box-shadow: 0px 8px 16px 0px rgba(12, 81, 140, 0.24);
|
||||
padding: 20px;
|
||||
margin-top: 44px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 242px;
|
||||
}
|
||||
|
||||
.title-section {
|
||||
/* color: #000; */
|
||||
font-family: Poppins;
|
||||
font-size: 40px;
|
||||
/* font-size: 3vw; */
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: 80px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.sub-title-section {
|
||||
/* color: #212B36; */
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
/* font-size: 1.5vw; */
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
.custom-card-lp {
|
||||
border-radius: 24px;
|
||||
border: 1px solid #d9d9d9;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.title-fs-20 {
|
||||
/* color: #0E1E28; */
|
||||
font-family: Poppins;
|
||||
font-size: 20px;
|
||||
/* font-size: 1.5vw; */
|
||||
font-style: normal;
|
||||
/* font-weight: 500; */
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
.sub-title-fs-12 {
|
||||
/* color: #0E1E28; */
|
||||
font-family: Poppins;
|
||||
font-size: 12px;
|
||||
/* font-size: 0.9vw; */
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.icon-container {
|
||||
display: inline-block;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 16px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.link-learn-more {
|
||||
/* color: #3B4F9F; */
|
||||
font-family: Poppins;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.wrapper-custom {
|
||||
/* background: #1B1D1F; */
|
||||
padding-left: 10vw;
|
||||
padding-right: 10vw;
|
||||
}
|
||||
|
||||
.media-left-icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.footer-title {
|
||||
/* color: #FFF; */
|
||||
font-family: Poppins;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.footer-sub-title {
|
||||
/* color: #C3C4C5; */
|
||||
font-family: Poppins;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.logo-footer {
|
||||
margin-bottom: 24px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.garis {
|
||||
/* background: #C3C4C5; */
|
||||
height: 0.2px;
|
||||
}
|
||||
.card-footer {
|
||||
background-color: transparent !important;
|
||||
border: none;
|
||||
}
|
||||
.slick-prev:before,
|
||||
.slick-next:before {
|
||||
color: var(--primarybg);
|
||||
}
|
||||
.img-header {
|
||||
object-fit: contain;
|
||||
}
|
||||
.underdev {
|
||||
font-family: "Public Sans";
|
||||
font-size: 64px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
.underdevsub {
|
||||
font-family: "Public Sans";
|
||||
font-size: 26px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsLandingPage() {
|
||||
<!-- SCRIPT -->
|
||||
<script type="text/javascript" src="assets/js/slick/slick.min.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
// lg
|
||||
$(".responsive-lg").slick({
|
||||
dots: false,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 2000,
|
||||
infinite: true,
|
||||
lazyLoad: "ondemand",
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
nextArrow: '<button type="button" class="slick-next">Next</button>',
|
||||
prevArrow:
|
||||
'<button type="button" class="slick-prev">Previous</button>',
|
||||
});
|
||||
|
||||
// md
|
||||
$(".responsive-md").slick({
|
||||
dots: false,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 2000,
|
||||
infinite: true,
|
||||
lazyLoad: "ondemand",
|
||||
slidesToShow: 2,
|
||||
slidesToScroll: 2,
|
||||
});
|
||||
|
||||
// sm
|
||||
$(".responsive-sm").slick({
|
||||
dots: false,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 2000,
|
||||
infinite: true,
|
||||
lazyLoad: "ondemand",
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<!-- SCRIPT -->
|
||||
}
|
||||
|
||||
templ ShowLandingPage(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,307 +1,307 @@
|
||||
package landingpage
|
||||
|
||||
import (
|
||||
services "cpone/services/dev"
|
||||
)
|
||||
|
||||
templ MedicalService(title string, desciption string, icon string, link string) {
|
||||
<div class="col-lg-4">
|
||||
<!-- 1 -->
|
||||
<div class="card custom-card-lp mr-6">
|
||||
<div class="card-body">
|
||||
<div class="icon-container bg-primary-transparent">
|
||||
<span
|
||||
class="iconify text-primary w-20 h-20"
|
||||
data-icon={ icon }
|
||||
></span>
|
||||
</div>
|
||||
<h5 class="card-title title-fs-20">{ title }</h5>
|
||||
<p class="card-text sub-title-fs-12">
|
||||
{ desciption }
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href={ templ.SafeURL(link) } class="link-learn-more text-primary">
|
||||
Learn More
|
||||
<span
|
||||
class="iconify text-primary w-20 h-20"
|
||||
data-icon="eva:arrow-forward-outline"
|
||||
></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ListMedicalService(medserData []services.ClientService) {
|
||||
<div class="row responsive-sm d-xs-block d-sm-block d-md-none">
|
||||
for _, d := range medserData {
|
||||
@MedicalService(d.ClientServiceName, d.ClientServiceDescription, d.ClientServiceIcon, d.ClientServiceLink)
|
||||
}
|
||||
</div>
|
||||
<div class="row responsive-md d-none d-md-block d-lg-none">
|
||||
for _, d := range medserData {
|
||||
@MedicalService(d.ClientServiceName, d.ClientServiceDescription, d.ClientServiceIcon, d.ClientServiceLink)
|
||||
}
|
||||
</div>
|
||||
<div class="row responsive-lg d-none d-lg-block">
|
||||
for _, d := range medserData {
|
||||
@MedicalService(d.ClientServiceName, d.ClientServiceDescription, d.ClientServiceIcon, d.ClientServiceLink)
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ HeaderSection(title string, desc string) {
|
||||
<div class="col-md-12 text-left">
|
||||
<h2 class="title-section text-black">{ title }</h2>
|
||||
<p class="sub-title-section text-black">
|
||||
{ desc }
|
||||
</p>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Advantage(title string, desc string) {
|
||||
<div class="row flex-grow-1">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<span
|
||||
class="iconify text-primary media-left-icon"
|
||||
data-icon="mingcute:certificate-line"
|
||||
></span>
|
||||
</div>
|
||||
<div class="media-body">
|
||||
<h4 class="title-fs-20 text-black ml-4">{ title }</h4>
|
||||
<p class="sub-title-fs-12 text-black ml-4">
|
||||
{ desc }
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ListAdvantage(adData []services.AdvantageClient) {
|
||||
<div class="row mt-5">
|
||||
<div class="col-md-6">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/why_westerindo_right.png"
|
||||
alt="Your Brand"
|
||||
class="align-top w-100 h-100 pt-4 pb-4"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-md-6 d-flex flex-column">
|
||||
for _, d := range adData {
|
||||
@Advantage(d.AdvantageClientName, d.AdvantageClientDesc)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ HeaderCard() {
|
||||
// Hp
|
||||
<div class="jumbotron bg-primary d-xs-block d-sm-block d-md-none">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-12 mb-3 d-flex justify-content-sm-end">
|
||||
<div class="d-flex m-1 align-items-center">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/jumbotron_left.png"
|
||||
class="img-fluid w-100 h-100 img-header"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-12 d-flex flex-column">
|
||||
<div class="mb-3">
|
||||
<h1 class="title-jumbotron-sm text-white">
|
||||
Invest in Your Well-being with Our Comprehensive Medical
|
||||
Check-Up
|
||||
</h1>
|
||||
<p class="sub-title-jumbotron text-white">
|
||||
Elevate your health journey with our thorough medical
|
||||
assessments, empowering you to take proactive steps towards a
|
||||
healthier, happier life.
|
||||
</p>
|
||||
<button type="button" class="btn btn-lg btn-pill bg-white">
|
||||
<span class="title-get-started">Get Started</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-auto"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End Hp
|
||||
// Tablet
|
||||
<div class="jumbotron bg-primary d-none d-md-block d-lg-none">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12 mb-3 d-flex justify-content-md-end">
|
||||
<div class="d-flex m-1 align-items-center">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/jumbotron_left.png"
|
||||
class="img-fluid w-100 h-100 img-header"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12 d-flex flex-column">
|
||||
<div class="mb-3">
|
||||
<h1 class="title-jumbotron-md text-white">
|
||||
Invest in Your Well-being with Our Comprehensive Medical
|
||||
Check-Up
|
||||
</h1>
|
||||
<p class="sub-title-jumbotron text-white">
|
||||
Elevate your health journey with our thorough medical
|
||||
assessments, empowering you to take proactive steps towards a
|
||||
healthier, happier life.
|
||||
</p>
|
||||
<button type="button" class="btn btn-lg btn-pill bg-white">
|
||||
<span class="title-get-started">Get Started</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-auto"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End Tablet
|
||||
// Dekstop
|
||||
<div class="jumbotron bg-primary d-none d-lg-block">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 d-flex flex-column">
|
||||
<div class="mb-3">
|
||||
<h1 class="title-jumbotron text-white">
|
||||
Invest in Your Well-being with Our Comprehensive Medical
|
||||
Check-Up
|
||||
</h1>
|
||||
<p class="sub-title-jumbotron text-white">
|
||||
Elevate your health journey with our thorough medical
|
||||
assessments, empowering you to take proactive steps towards a
|
||||
healthier, happier life.
|
||||
</p>
|
||||
<button type="button" class="btn btn-lg btn-pill bg-white">
|
||||
<span class="title-get-started">Get Started</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-auto"></div>
|
||||
</div>
|
||||
<div class="col-md-4 d-flex justify-content-md-end">
|
||||
<!-- style="
|
||||
flex: 2;
|
||||
margin: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
" -->
|
||||
<div class="d-flex m-1o align-items-center">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/jumbotron_left.png"
|
||||
class="img-fluid w-100 h-100 img-header"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End Dekstop
|
||||
}
|
||||
|
||||
templ Promotion(prm services.Promotion) {
|
||||
<div class="col-md-4 mt-2">
|
||||
<img
|
||||
src={ prm.PromotionAsset }
|
||||
class="img-fluid"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ListPromotion(prm []services.Promotion) {
|
||||
<div class="row responsive-sm d-xs-block d-sm-block d-md-none">
|
||||
for _, d := range prm {
|
||||
@Promotion(d)
|
||||
}
|
||||
</div>
|
||||
<div class="row responsive-md d-none d-md-block d-lg-none">
|
||||
for _, d := range prm {
|
||||
@Promotion(d)
|
||||
}
|
||||
</div>
|
||||
<div class="row responsive-lg d-none d-lg-block d-xl-block">
|
||||
for _, d := range prm {
|
||||
@Promotion(d)
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Footer() {
|
||||
<footer class="wrapper-custom bg-black pb-25 pt-25 mt-25">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md-12 col-lg">
|
||||
<img
|
||||
src="asset-corporate-portal/media/landingpage/logo.png"
|
||||
class="logo-footer"
|
||||
width="126"
|
||||
height="40"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
<div class="text-white d-flex flex-row mb-3">
|
||||
<!-- style="display: flex; flex-direction: row; color: white;align-items: start; margin-bottom: 24px;" -->
|
||||
<div class="mr-3 mt-1">
|
||||
<i
|
||||
class="fas fa-map-marker-alt marker footer-icon text-warning"
|
||||
></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<p class="footer-sub-title text-grey">
|
||||
Jl. Cipaku I No.5, RT.2/RW.4, Petogogan, Kec. Kby. Baru, Kota
|
||||
Jakarta Selatan, Daerah Khusus Ibukota Jakarta 12170
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex flex-row">
|
||||
<div class="mr-3 mt-1">
|
||||
<i class="fas fa-phone footer-icon text-warning"></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<p class="footer-sub-title text-grey">021-7392345</p>
|
||||
<p class="footer-sub-title text-grey">021-2702525</p>
|
||||
<p class="footer-sub-title text-grey">021-7255080</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
<h4 class="footer-title text-white mb-3">Dashboard</h4>
|
||||
<p class="footer-sub-title text-grey">
|
||||
Employee Medical Health Analytic Clinic Admission
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
<h4 class="footer-title text-white">Benefit</h4>
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
<h4 class="footer-title text-white">Finance & Claims</h4>
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
<h4 class="footer-title text-white">Membership</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="garis bg-grey"></div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-6">
|
||||
<p class="footer-sub-title text-grey">
|
||||
© Copyright 2024. Organized PT SADHANA ABIYASA SAMPOERNA (Privacy
|
||||
Policy)
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-6 text-right">
|
||||
<p class="footer-icons">
|
||||
<a href="#" class="mr-3"><i class="fab fa-whatsapp"></i></a>
|
||||
<a href="#" class="mr-3"><i class="fab fa-facebook"></i></a>
|
||||
<a href="#"><i class="fab fa-instagram"></i></a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
}
|
||||
package landingpage
|
||||
|
||||
import (
|
||||
services "cpone/services/dev"
|
||||
)
|
||||
|
||||
templ MedicalService(title string, desciption string, icon string, link string) {
|
||||
<div class="col-lg-4">
|
||||
<!-- 1 -->
|
||||
<div class="card custom-card-lp mr-6">
|
||||
<div class="card-body">
|
||||
<div class="icon-container bg-primary-transparent">
|
||||
<span
|
||||
class="iconify text-primary w-20 h-20"
|
||||
data-icon={ icon }
|
||||
></span>
|
||||
</div>
|
||||
<h5 class="card-title title-fs-20">{ title }</h5>
|
||||
<p class="card-text sub-title-fs-12">
|
||||
{ desciption }
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href={ templ.SafeURL(link) } class="link-learn-more text-primary">
|
||||
Learn More
|
||||
<span
|
||||
class="iconify text-primary w-20 h-20"
|
||||
data-icon="eva:arrow-forward-outline"
|
||||
></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ListMedicalService(medserData []services.ClientService) {
|
||||
<div class="row responsive-sm d-xs-block d-sm-block d-md-none">
|
||||
for _, d := range medserData {
|
||||
@MedicalService(d.ClientServiceName, d.ClientServiceDescription, d.ClientServiceIcon, d.ClientServiceLink)
|
||||
}
|
||||
</div>
|
||||
<div class="row responsive-md d-none d-md-block d-lg-none">
|
||||
for _, d := range medserData {
|
||||
@MedicalService(d.ClientServiceName, d.ClientServiceDescription, d.ClientServiceIcon, d.ClientServiceLink)
|
||||
}
|
||||
</div>
|
||||
<div class="row responsive-lg d-none d-lg-block">
|
||||
for _, d := range medserData {
|
||||
@MedicalService(d.ClientServiceName, d.ClientServiceDescription, d.ClientServiceIcon, d.ClientServiceLink)
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ HeaderSection(title string, desc string) {
|
||||
<div class="col-md-12 text-left">
|
||||
<h2 class="title-section text-black">{ title }</h2>
|
||||
<p class="sub-title-section text-black">
|
||||
{ desc }
|
||||
</p>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Advantage(title string, desc string) {
|
||||
<div class="row flex-grow-1">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<span
|
||||
class="iconify text-primary media-left-icon"
|
||||
data-icon="mingcute:certificate-line"
|
||||
></span>
|
||||
</div>
|
||||
<div class="media-body">
|
||||
<h4 class="title-fs-20 text-black ml-4">{ title }</h4>
|
||||
<p class="sub-title-fs-12 text-black ml-4">
|
||||
{ desc }
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ListAdvantage(adData []services.AdvantageClient) {
|
||||
<div class="row mt-5">
|
||||
<div class="col-md-6">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/why_westerindo_right.png"
|
||||
alt="Your Brand"
|
||||
class="align-top w-100 h-100 pt-4 pb-4"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-md-6 d-flex flex-column">
|
||||
for _, d := range adData {
|
||||
@Advantage(d.AdvantageClientName, d.AdvantageClientDesc)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ HeaderCard() {
|
||||
// Hp
|
||||
<div class="jumbotron bg-primary d-xs-block d-sm-block d-md-none">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-12 mb-3 d-flex justify-content-sm-end">
|
||||
<div class="d-flex m-1 align-items-center">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/jumbotron_left.png"
|
||||
class="img-fluid w-100 h-100 img-header"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-12 d-flex flex-column">
|
||||
<div class="mb-3">
|
||||
<h1 class="title-jumbotron-sm text-white">
|
||||
Invest in Your Well-being with Our Comprehensive Medical
|
||||
Check-Up
|
||||
</h1>
|
||||
<p class="sub-title-jumbotron text-white">
|
||||
Elevate your health journey with our thorough medical
|
||||
assessments, empowering you to take proactive steps towards a
|
||||
healthier, happier life.
|
||||
</p>
|
||||
<button type="button" class="btn btn-lg btn-pill bg-white">
|
||||
<span class="title-get-started">Get Started</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-auto"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End Hp
|
||||
// Tablet
|
||||
<div class="jumbotron bg-primary d-none d-md-block d-lg-none">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12 mb-3 d-flex justify-content-md-end">
|
||||
<div class="d-flex m-1 align-items-center">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/jumbotron_left.png"
|
||||
class="img-fluid w-100 h-100 img-header"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12 d-flex flex-column">
|
||||
<div class="mb-3">
|
||||
<h1 class="title-jumbotron-md text-white">
|
||||
Invest in Your Well-being with Our Comprehensive Medical
|
||||
Check-Up
|
||||
</h1>
|
||||
<p class="sub-title-jumbotron text-white">
|
||||
Elevate your health journey with our thorough medical
|
||||
assessments, empowering you to take proactive steps towards a
|
||||
healthier, happier life.
|
||||
</p>
|
||||
<button type="button" class="btn btn-lg btn-pill bg-white">
|
||||
<span class="title-get-started">Get Started</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-auto"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End Tablet
|
||||
// Dekstop
|
||||
<div class="jumbotron bg-primary d-none d-lg-block">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 d-flex flex-column">
|
||||
<div class="mb-3">
|
||||
<h1 class="title-jumbotron text-white">
|
||||
Invest in Your Well-being with Our Comprehensive Medical
|
||||
Check-Up
|
||||
</h1>
|
||||
<p class="sub-title-jumbotron text-white">
|
||||
Elevate your health journey with our thorough medical
|
||||
assessments, empowering you to take proactive steps towards a
|
||||
healthier, happier life.
|
||||
</p>
|
||||
<button type="button" class="btn btn-lg btn-pill bg-white">
|
||||
<span class="title-get-started">Get Started</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-auto"></div>
|
||||
</div>
|
||||
<div class="col-md-4 d-flex justify-content-md-end">
|
||||
<!-- style="
|
||||
flex: 2;
|
||||
margin: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
" -->
|
||||
<div class="d-flex m-1o align-items-center">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/landingpage/jumbotron_left.png"
|
||||
class="img-fluid w-100 h-100 img-header"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
// End Dekstop
|
||||
}
|
||||
|
||||
templ Promotion(prm services.Promotion) {
|
||||
<div class="col-md-4 mt-2">
|
||||
<img
|
||||
src={ prm.PromotionAsset }
|
||||
class="img-fluid"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ListPromotion(prm []services.Promotion) {
|
||||
<div class="row responsive-sm d-xs-block d-sm-block d-md-none">
|
||||
for _, d := range prm {
|
||||
@Promotion(d)
|
||||
}
|
||||
</div>
|
||||
<div class="row responsive-md d-none d-md-block d-lg-none">
|
||||
for _, d := range prm {
|
||||
@Promotion(d)
|
||||
}
|
||||
</div>
|
||||
<div class="row responsive-lg d-none d-lg-block d-xl-block">
|
||||
for _, d := range prm {
|
||||
@Promotion(d)
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Footer() {
|
||||
<footer class="wrapper-custom bg-black pb-25 pt-25 mt-25">
|
||||
<div class="row mb-5">
|
||||
<div class="col-md-12 col-lg">
|
||||
<img
|
||||
src="asset-corporate-portal/media/landingpage/logo.png"
|
||||
class="logo-footer"
|
||||
width="126"
|
||||
height="40"
|
||||
alt="Your Brand"
|
||||
/>
|
||||
<div class="text-white d-flex flex-row mb-3">
|
||||
<!-- style="display: flex; flex-direction: row; color: white;align-items: start; margin-bottom: 24px;" -->
|
||||
<div class="mr-3 mt-1">
|
||||
<i
|
||||
class="fas fa-map-marker-alt marker footer-icon text-warning"
|
||||
></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<p class="footer-sub-title text-grey">
|
||||
Jl. Cipaku I No.5, RT.2/RW.4, Petogogan, Kec. Kby. Baru, Kota
|
||||
Jakarta Selatan, Daerah Khusus Ibukota Jakarta 12170
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex flex-row">
|
||||
<div class="mr-3 mt-1">
|
||||
<i class="fas fa-phone footer-icon text-warning"></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<p class="footer-sub-title text-grey">021-7392345</p>
|
||||
<p class="footer-sub-title text-grey">021-2702525</p>
|
||||
<p class="footer-sub-title text-grey">021-7255080</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
<h4 class="footer-title text-white mb-3">Dashboard</h4>
|
||||
<p class="footer-sub-title text-grey">
|
||||
Employee Medical Health Analytic Clinic Admission
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
<h4 class="footer-title text-white">Benefit</h4>
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
<h4 class="footer-title text-white">Finance & Claims</h4>
|
||||
</div>
|
||||
<div class="col-md col-lg">
|
||||
<h4 class="footer-title text-white">Membership</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="garis bg-grey"></div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-6">
|
||||
<p class="footer-sub-title text-grey">
|
||||
© Copyright 2024. Organized PT SADHANA ABIYASA SAMPOERNA (Privacy
|
||||
Policy)
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-6 text-right">
|
||||
<p class="footer-icons">
|
||||
<a href="#" class="mr-3"><i class="fab fa-whatsapp"></i></a>
|
||||
<a href="#" class="mr-3"><i class="fab fa-facebook"></i></a>
|
||||
<a href="#"><i class="fab fa-instagram"></i></a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
}
|
||||
|
||||
@@ -1,103 +1,103 @@
|
||||
package login
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ MainLogin() {
|
||||
<div class="d-flex flex-column flex-root">
|
||||
<div
|
||||
class="login login-1 login-signin-on d-flex flex-column flex-lg-row flex-column-fluid bg-white"
|
||||
id="kt_login"
|
||||
>
|
||||
<!--begin::Aside-->
|
||||
@AsideLeft()
|
||||
<!--begin::Aside-->
|
||||
<!--begin::Content-->
|
||||
<div
|
||||
class="login-content flex-row-fluid d-flex flex-column justify-content-center position-relative overflow-hidden p-7 mx-auto"
|
||||
>
|
||||
<!--begin::Content body-->
|
||||
<div class="d-flex flex-column-fluid flex-center">
|
||||
<!--begin::Signin-->
|
||||
<div class="login-form login-signin">
|
||||
<!--begin::Form-->
|
||||
@FormSignin()
|
||||
<!--end::Form-->
|
||||
</div>
|
||||
<!--end::Signin-->
|
||||
<!--begin::Signup -->
|
||||
<div class="login-form login-signup">
|
||||
<!--begin::Form -->
|
||||
@FormSignup()
|
||||
<!--end::Form -->
|
||||
</div>
|
||||
<!--end::Signup -->
|
||||
<!--begin::Forgot-->
|
||||
<div class="login-form login-forgot">
|
||||
<!--begin::Form-->
|
||||
@ForgotPassword()
|
||||
<!--end::Form-->
|
||||
</div>
|
||||
<!--end::Forgot-->
|
||||
</div>
|
||||
<!--end::Content body-->
|
||||
<!--end::Content footer-->
|
||||
</div>
|
||||
<!--end::Content-->
|
||||
</div>
|
||||
<!--end::Login-->
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssLogin() {
|
||||
<style>
|
||||
.title-company {
|
||||
color: #181c32;
|
||||
font-family: Poppins;
|
||||
font-size: 31px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
.subtitle-company {
|
||||
color: #a7a8bb;
|
||||
font-family: Poppins;
|
||||
font-size: 18px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
}
|
||||
.aside-title {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-family: Poppins;
|
||||
font-size: 28px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
letter-spacing: -0.84px;
|
||||
}
|
||||
.aside-subtitle {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-family: Poppins;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 30px; /* 187.5% */
|
||||
letter-spacing: -0.48px;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsLogin() {
|
||||
<script src="/asset-corporate-portal/js/login-general.js"></script>
|
||||
}
|
||||
|
||||
templ ShowLogin(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package login
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ MainLogin() {
|
||||
<div class="d-flex flex-column flex-root">
|
||||
<div
|
||||
class="login login-1 login-signin-on d-flex flex-column flex-lg-row flex-column-fluid bg-white"
|
||||
id="kt_login"
|
||||
>
|
||||
<!--begin::Aside-->
|
||||
@AsideLeft()
|
||||
<!--begin::Aside-->
|
||||
<!--begin::Content-->
|
||||
<div
|
||||
class="login-content flex-row-fluid d-flex flex-column justify-content-center position-relative overflow-hidden p-7 mx-auto"
|
||||
>
|
||||
<!--begin::Content body-->
|
||||
<div class="d-flex flex-column-fluid flex-center">
|
||||
<!--begin::Signin-->
|
||||
<div class="login-form login-signin">
|
||||
<!--begin::Form-->
|
||||
@FormSignin()
|
||||
<!--end::Form-->
|
||||
</div>
|
||||
<!--end::Signin-->
|
||||
<!--begin::Signup -->
|
||||
<div class="login-form login-signup">
|
||||
<!--begin::Form -->
|
||||
@FormSignup()
|
||||
<!--end::Form -->
|
||||
</div>
|
||||
<!--end::Signup -->
|
||||
<!--begin::Forgot-->
|
||||
<div class="login-form login-forgot">
|
||||
<!--begin::Form-->
|
||||
@ForgotPassword()
|
||||
<!--end::Form-->
|
||||
</div>
|
||||
<!--end::Forgot-->
|
||||
</div>
|
||||
<!--end::Content body-->
|
||||
<!--end::Content footer-->
|
||||
</div>
|
||||
<!--end::Content-->
|
||||
</div>
|
||||
<!--end::Login-->
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssLogin() {
|
||||
<style>
|
||||
.title-company {
|
||||
color: #181c32;
|
||||
font-family: Poppins;
|
||||
font-size: 31px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
.subtitle-company {
|
||||
color: #a7a8bb;
|
||||
font-family: Poppins;
|
||||
font-size: 18px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
}
|
||||
.aside-title {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-family: Poppins;
|
||||
font-size: 28px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
letter-spacing: -0.84px;
|
||||
}
|
||||
.aside-subtitle {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-family: Poppins;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 30px; /* 187.5% */
|
||||
letter-spacing: -0.48px;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsLogin() {
|
||||
<script src="/asset-corporate-portal/js/login-general.js"></script>
|
||||
}
|
||||
|
||||
templ ShowLogin(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,274 +1,274 @@
|
||||
package login
|
||||
|
||||
templ AsideLeft() {
|
||||
<div class="login-aside d-flex flex-column flex-row-auto bg-primary">
|
||||
<!--begin::Aside Top-->
|
||||
<div class="d-flex flex-column-auto flex-column pt-lg-40 pt-15 px-10">
|
||||
<!--begin::Aside header-->
|
||||
<div class="aside-title mb-5">
|
||||
Empowering Your Workforce's Health
|
||||
</div>
|
||||
<!--end::Aside header-->
|
||||
<!--begin::Aside title-->
|
||||
<div class="aside-subtitle">
|
||||
Discover peace of mind and prioritize your health with our
|
||||
comprehensive medical check-up packages
|
||||
</div>
|
||||
<!--end::Aside title-->
|
||||
</div>
|
||||
<!--end::Aside Top-->
|
||||
<!--begin::Aside Bottom-->
|
||||
<div
|
||||
class="d-flex bgi-no-repeat flex-row-fluid justify-content-center align-items-end"
|
||||
>
|
||||
<img
|
||||
src="/asset-corporate-portal/media/login/login-company-vector.png"
|
||||
class="img-fluid"
|
||||
style="height: 55vh; width: 55vh"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Aside Bottom-->
|
||||
</div>
|
||||
}
|
||||
|
||||
templ FormSignin() {
|
||||
<form
|
||||
class="form"
|
||||
novalidate="novalidate"
|
||||
id="kt_login_signin_form"
|
||||
>
|
||||
<!--begin::Title-->
|
||||
<div class="d-flex justify-content-center mb-5">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/logo/logo.png"
|
||||
alt=""
|
||||
style="height: 103px"
|
||||
/>
|
||||
</div>
|
||||
<div class="pt-2">
|
||||
<h3
|
||||
class="d-flex justify-content-center title-company text-dark"
|
||||
>
|
||||
Welcome to Corporate Portal
|
||||
</h3>
|
||||
</div>
|
||||
<div class="pb-10 pt-0">
|
||||
<h3 class="subtitle-company" style="color: #a7a8bb">
|
||||
Sign in to access your account
|
||||
</h3>
|
||||
</div>
|
||||
<!--begin::Title-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<label class="font-size-h6 font-weight-bolder text-dark">Email</label>
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg"
|
||||
type="text"
|
||||
name="username"
|
||||
autocomplete="off"
|
||||
placeholder="Enter your email"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<div class="d-flex justify-content-between mt-n5">
|
||||
<label
|
||||
class="font-size-h6 font-weight-bolder text-dark pt-5"
|
||||
>Password</label>
|
||||
</div>
|
||||
<div class="input-group">
|
||||
<!-- form-control form-control-solid -->
|
||||
<input
|
||||
class="h-auto form-control form-control-solid py-7 px-6 rounded-lg rounded-right-0"
|
||||
type="password"
|
||||
name="password"
|
||||
id="user-password"
|
||||
autocomplete="off"
|
||||
placeholder="Enter your password"
|
||||
/>
|
||||
<div class="input-group-append">
|
||||
<span
|
||||
class="input-group-text rounded-lg rounded-left-0"
|
||||
style="border: 0"
|
||||
>
|
||||
<!-- far fa-eye-slash -->
|
||||
<a class="btn" role="button" id="btn-show">
|
||||
<i class="far fa-eye-slash" id="password-icon"></i>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-end">
|
||||
<a
|
||||
href="javascript:;"
|
||||
class="font-size-h6 font-weight-bolder text-hover-primary mb-5 text-primary"
|
||||
id="kt_login_forgot"
|
||||
>
|
||||
Forgot Password ?
|
||||
</a>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Action-->
|
||||
<div class="pb-lg-0 pb-5 pt-5">
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_signin_submit"
|
||||
class="btn btn-block font-weight-bolder text-white font-size-h6 px-8 py-4 my-3 mr-3 mt-5 btn-primary"
|
||||
>
|
||||
Sign In
|
||||
</button>
|
||||
</div>
|
||||
<!--end::Action-->
|
||||
</form>
|
||||
}
|
||||
|
||||
templ FormSignup() {
|
||||
<form
|
||||
class="form"
|
||||
novalidate="novalidate"
|
||||
id="kt_login_signup_form"
|
||||
>
|
||||
<!--begin::Title -->
|
||||
<div class="pb-13 pt-lg-0 pt-5">
|
||||
<h3
|
||||
class="font-weight-bolder text-dark font-size-h4 font-size-h1-lg"
|
||||
>
|
||||
Sign Up
|
||||
</h3>
|
||||
<p class="text-muted font-weight-bold font-size-h4">
|
||||
Enter your details to create your account
|
||||
</p>
|
||||
</div>
|
||||
<!--end::Title -->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="text"
|
||||
placeholder="Fullname"
|
||||
name="fullname"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="email"
|
||||
placeholder="Email"
|
||||
name="email"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="password"
|
||||
placeholder="Password"
|
||||
name="password"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="password"
|
||||
placeholder="Confirm password"
|
||||
name="cpassword"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<label class="checkbox mb-0">
|
||||
<input type="checkbox" name="agree"/>I Agree the
|
||||
<a href="#">terms and conditions</a>.
|
||||
<span></span>
|
||||
</label>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group d-flex flex-wrap pb-lg-0 pb-3">
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_signup_submit"
|
||||
class="btn btn-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 mr-4"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_signup_cancel"
|
||||
class="btn btn-light-primary font-weight-bolder font-size-h6 px-8 py-4 my-3"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
</form>
|
||||
}
|
||||
|
||||
templ ForgotPassword() {
|
||||
<form
|
||||
class="form"
|
||||
novalidate="novalidate"
|
||||
id="kt_login_forgot_form"
|
||||
>
|
||||
<!--begin::Title-->
|
||||
<div class="d-flex justify-content-center mb-5">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/logo/logo.png"
|
||||
alt=""
|
||||
style="height: 103px"
|
||||
/>
|
||||
</div>
|
||||
<div class="pb-13 pt-lg-0 pt-5">
|
||||
<h3
|
||||
class="font-weight-bolder text-dark font-size-h4 font-size-h1-lg"
|
||||
>
|
||||
Forgotten Password ?
|
||||
</h3>
|
||||
<p class="text-muted font-weight-bold font-size-h4">
|
||||
Enter your email to reset your password
|
||||
</p>
|
||||
</div>
|
||||
<!--end::Title-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="email"
|
||||
placeholder="Email"
|
||||
name="email"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group d-flex flex-wrap pb-lg-0">
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_forgot_submit"
|
||||
class="btn btn-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 btn-block btn-submit"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_forgot_cancel"
|
||||
class="btn btn-light-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 btn-block btn-cancel"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
</form>
|
||||
}
|
||||
package login
|
||||
|
||||
templ AsideLeft() {
|
||||
<div class="login-aside d-flex flex-column flex-row-auto bg-primary">
|
||||
<!--begin::Aside Top-->
|
||||
<div class="d-flex flex-column-auto flex-column pt-lg-40 pt-15 px-10">
|
||||
<!--begin::Aside header-->
|
||||
<div class="aside-title mb-5">
|
||||
Empowering Your Workforce's Health
|
||||
</div>
|
||||
<!--end::Aside header-->
|
||||
<!--begin::Aside title-->
|
||||
<div class="aside-subtitle">
|
||||
Discover peace of mind and prioritize your health with our
|
||||
comprehensive medical check-up packages
|
||||
</div>
|
||||
<!--end::Aside title-->
|
||||
</div>
|
||||
<!--end::Aside Top-->
|
||||
<!--begin::Aside Bottom-->
|
||||
<div
|
||||
class="d-flex bgi-no-repeat flex-row-fluid justify-content-center align-items-end"
|
||||
>
|
||||
<img
|
||||
src="/asset-corporate-portal/media/login/login-company-vector.png"
|
||||
class="img-fluid"
|
||||
style="height: 55vh; width: 55vh"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Aside Bottom-->
|
||||
</div>
|
||||
}
|
||||
|
||||
templ FormSignin() {
|
||||
<form
|
||||
class="form"
|
||||
novalidate="novalidate"
|
||||
id="kt_login_signin_form"
|
||||
>
|
||||
<!--begin::Title-->
|
||||
<div class="d-flex justify-content-center mb-5">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/logo/logo.png"
|
||||
alt=""
|
||||
style="height: 103px"
|
||||
/>
|
||||
</div>
|
||||
<div class="pt-2">
|
||||
<h3
|
||||
class="d-flex justify-content-center title-company text-dark"
|
||||
>
|
||||
Welcome to Corporate Portal
|
||||
</h3>
|
||||
</div>
|
||||
<div class="pb-10 pt-0">
|
||||
<h3 class="subtitle-company" style="color: #a7a8bb">
|
||||
Sign in to access your account
|
||||
</h3>
|
||||
</div>
|
||||
<!--begin::Title-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<label class="font-size-h6 font-weight-bolder text-dark">Email</label>
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg"
|
||||
type="text"
|
||||
name="username"
|
||||
autocomplete="off"
|
||||
placeholder="Enter your email"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<div class="d-flex justify-content-between mt-n5">
|
||||
<label
|
||||
class="font-size-h6 font-weight-bolder text-dark pt-5"
|
||||
>Password</label>
|
||||
</div>
|
||||
<div class="input-group">
|
||||
<!-- form-control form-control-solid -->
|
||||
<input
|
||||
class="h-auto form-control form-control-solid py-7 px-6 rounded-lg rounded-right-0"
|
||||
type="password"
|
||||
name="password"
|
||||
id="user-password"
|
||||
autocomplete="off"
|
||||
placeholder="Enter your password"
|
||||
/>
|
||||
<div class="input-group-append">
|
||||
<span
|
||||
class="input-group-text rounded-lg rounded-left-0"
|
||||
style="border: 0"
|
||||
>
|
||||
<!-- far fa-eye-slash -->
|
||||
<a class="btn" role="button" id="btn-show">
|
||||
<i class="far fa-eye-slash" id="password-icon"></i>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-end">
|
||||
<a
|
||||
href="javascript:;"
|
||||
class="font-size-h6 font-weight-bolder text-hover-primary mb-5 text-primary"
|
||||
id="kt_login_forgot"
|
||||
>
|
||||
Forgot Password ?
|
||||
</a>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Action-->
|
||||
<div class="pb-lg-0 pb-5 pt-5">
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_signin_submit"
|
||||
class="btn btn-block font-weight-bolder text-white font-size-h6 px-8 py-4 my-3 mr-3 mt-5 btn-primary"
|
||||
>
|
||||
Sign In
|
||||
</button>
|
||||
</div>
|
||||
<!--end::Action-->
|
||||
</form>
|
||||
}
|
||||
|
||||
templ FormSignup() {
|
||||
<form
|
||||
class="form"
|
||||
novalidate="novalidate"
|
||||
id="kt_login_signup_form"
|
||||
>
|
||||
<!--begin::Title -->
|
||||
<div class="pb-13 pt-lg-0 pt-5">
|
||||
<h3
|
||||
class="font-weight-bolder text-dark font-size-h4 font-size-h1-lg"
|
||||
>
|
||||
Sign Up
|
||||
</h3>
|
||||
<p class="text-muted font-weight-bold font-size-h4">
|
||||
Enter your details to create your account
|
||||
</p>
|
||||
</div>
|
||||
<!--end::Title -->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="text"
|
||||
placeholder="Fullname"
|
||||
name="fullname"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="email"
|
||||
placeholder="Email"
|
||||
name="email"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="password"
|
||||
placeholder="Password"
|
||||
name="password"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="password"
|
||||
placeholder="Confirm password"
|
||||
name="cpassword"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<label class="checkbox mb-0">
|
||||
<input type="checkbox" name="agree"/>I Agree the
|
||||
<a href="#">terms and conditions</a>.
|
||||
<span></span>
|
||||
</label>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group d-flex flex-wrap pb-lg-0 pb-3">
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_signup_submit"
|
||||
class="btn btn-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 mr-4"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_signup_cancel"
|
||||
class="btn btn-light-primary font-weight-bolder font-size-h6 px-8 py-4 my-3"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
</form>
|
||||
}
|
||||
|
||||
templ ForgotPassword() {
|
||||
<form
|
||||
class="form"
|
||||
novalidate="novalidate"
|
||||
id="kt_login_forgot_form"
|
||||
>
|
||||
<!--begin::Title-->
|
||||
<div class="d-flex justify-content-center mb-5">
|
||||
<img
|
||||
src="/asset-corporate-portal/media/logo/logo.png"
|
||||
alt=""
|
||||
style="height: 103px"
|
||||
/>
|
||||
</div>
|
||||
<div class="pb-13 pt-lg-0 pt-5">
|
||||
<h3
|
||||
class="font-weight-bolder text-dark font-size-h4 font-size-h1-lg"
|
||||
>
|
||||
Forgotten Password ?
|
||||
</h3>
|
||||
<p class="text-muted font-weight-bold font-size-h4">
|
||||
Enter your email to reset your password
|
||||
</p>
|
||||
</div>
|
||||
<!--end::Title-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group">
|
||||
<input
|
||||
class="form-control form-control-solid h-auto py-7 px-6 rounded-lg font-size-h6"
|
||||
type="email"
|
||||
placeholder="Email"
|
||||
name="email"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
<!--begin::Form group-->
|
||||
<div class="form-group d-flex flex-wrap pb-lg-0">
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_forgot_submit"
|
||||
class="btn btn-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 btn-block btn-submit"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="kt_login_forgot_cancel"
|
||||
class="btn btn-light-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 btn-block btn-cancel"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
<!--end::Form group-->
|
||||
</form>
|
||||
}
|
||||
|
||||
@@ -1,215 +1,215 @@
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/component/breadcrumbadmin"
|
||||
"cpone/models"
|
||||
"cpone/component/table"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
"cpone/component/pagination"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentMasterMenuUserGroup(ugData []models.UserGroup, contentID string) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumadmin.MainBreadcrumbAdmin()
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target="#dialogNew"
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button type="button" class="btn btn-primary btn-block">Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id={ contentID }>
|
||||
@tablecomponent.Table([]string{"KODE", "USERGROUP", "AKSI"}, []string{"40%", "40%", "20%"}, TableRow(ugData), pagination.Pagination(20, 1, "dev/usergroup/pagination", contentID))
|
||||
</div>
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
@modalcomponent.Modal("dialogNew", "New - User Group", DialogNewBody("", "", "", "", ""), DialogNewAction(), BtnCloseNew())
|
||||
@modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSku()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRow(data []models.UserGroup) {
|
||||
// /usergroup/edit
|
||||
// <a
|
||||
// id="btneditug"
|
||||
// type="button"
|
||||
// class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
// onclick="htmx.trigger('#btneditug', 'htmx:abort')"
|
||||
// hx-target="#modalbdyEdit"
|
||||
// hx-swap="innerHTML"
|
||||
// hx-get={ "/client/usergroup/edit?id=" + strconv.Itoa(v.UserGroupID) }
|
||||
// hx-on::before-request="ShowLoading()"
|
||||
// hx-on::after-request="ShowForm()"
|
||||
// data-toggle="modal"
|
||||
// data-target="#dialogEdit"
|
||||
// >
|
||||
// Edit
|
||||
// </a>
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.UserGroupKode }</td>
|
||||
<td>{ v.UserGroupName }</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogEdit" + strconv.Itoa(v.UserGroupID) }
|
||||
>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogDelete" + strconv.Itoa(v.UserGroupID) }
|
||||
>Hapus</a>
|
||||
@modalcomponent.Modal("dialogEdit"+strconv.Itoa(v.UserGroupID),
|
||||
"Edit - User Group",
|
||||
DialogEditBody(v.UserGroupKode, v.UserGroupName),
|
||||
DialogEditAction(),
|
||||
BtnCloseNew())
|
||||
@modalcomponent.ModalConfirmation(
|
||||
"dialogDelete"+strconv.Itoa(v.UserGroupID),
|
||||
"Konfirmasi",
|
||||
"Apakah anda yakin menghapus user group berikut ?", BtnCloseDelete(),
|
||||
[]string{"Kode", "User Group"}, []string{v.UserGroupKode, v.UserGroupName}, DialogDeleteAction())
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ DialogDeleteAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDelete() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSku() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
}
|
||||
|
||||
templ Pagination() {
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap">
|
||||
<div class="d-flex flex-wrap py-2 mr-3">
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">23</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light btn-hover-primary active mr-2 my-1">24</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">25</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">26</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">27</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">28</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-next icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-next icon-xs"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroup() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroup() {
|
||||
}
|
||||
|
||||
// templ ShowMasterMenuUserGroup(title string, cmp templ.Component, css templ.Component, js templ.Component, dataMenu []services.MasterMenu, dataUser models.User) {
|
||||
// @layout.CorporateLayout(title, css, js, dataMenu, dataUser) {
|
||||
// @cmp
|
||||
// }
|
||||
// }
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/component/breadcrumbadmin"
|
||||
"cpone/models"
|
||||
"cpone/component/table"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
"cpone/component/pagination"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentMasterMenuUserGroup(ugData []models.UserGroup, contentID string) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumadmin.MainBreadcrumbAdmin()
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target="#dialogNew"
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button type="button" class="btn btn-primary btn-block">Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id={ contentID }>
|
||||
@tablecomponent.Table([]string{"KODE", "USERGROUP", "AKSI"}, []string{"40%", "40%", "20%"}, TableRow(ugData), pagination.Pagination(20, 1, "dev/usergroup/pagination", contentID))
|
||||
</div>
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
@modalcomponent.Modal("dialogNew", "New - User Group", DialogNewBody("", "", "", "", ""), DialogNewAction(), BtnCloseNew())
|
||||
@modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSku()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRow(data []models.UserGroup) {
|
||||
// /usergroup/edit
|
||||
// <a
|
||||
// id="btneditug"
|
||||
// type="button"
|
||||
// class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
// onclick="htmx.trigger('#btneditug', 'htmx:abort')"
|
||||
// hx-target="#modalbdyEdit"
|
||||
// hx-swap="innerHTML"
|
||||
// hx-get={ "/client/usergroup/edit?id=" + strconv.Itoa(v.UserGroupID) }
|
||||
// hx-on::before-request="ShowLoading()"
|
||||
// hx-on::after-request="ShowForm()"
|
||||
// data-toggle="modal"
|
||||
// data-target="#dialogEdit"
|
||||
// >
|
||||
// Edit
|
||||
// </a>
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.UserGroupKode }</td>
|
||||
<td>{ v.UserGroupName }</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogEdit" + strconv.Itoa(v.UserGroupID) }
|
||||
>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogDelete" + strconv.Itoa(v.UserGroupID) }
|
||||
>Hapus</a>
|
||||
@modalcomponent.Modal("dialogEdit"+strconv.Itoa(v.UserGroupID),
|
||||
"Edit - User Group",
|
||||
DialogEditBody(v.UserGroupKode, v.UserGroupName),
|
||||
DialogEditAction(),
|
||||
BtnCloseNew())
|
||||
@modalcomponent.ModalConfirmation(
|
||||
"dialogDelete"+strconv.Itoa(v.UserGroupID),
|
||||
"Konfirmasi",
|
||||
"Apakah anda yakin menghapus user group berikut ?", BtnCloseDelete(),
|
||||
[]string{"Kode", "User Group"}, []string{v.UserGroupKode, v.UserGroupName}, DialogDeleteAction())
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ DialogDeleteAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDelete() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSku() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
}
|
||||
|
||||
templ Pagination() {
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap">
|
||||
<div class="d-flex flex-wrap py-2 mr-3">
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">23</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light btn-hover-primary active mr-2 my-1">24</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">25</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">26</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">27</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">28</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-next icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-next icon-xs"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroup() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroup() {
|
||||
}
|
||||
|
||||
// templ ShowMasterMenuUserGroup(title string, cmp templ.Component, css templ.Component, js templ.Component, dataMenu []services.MasterMenu, dataUser models.User) {
|
||||
// @layout.CorporateLayout(title, css, js, dataMenu, dataUser) {
|
||||
// @cmp
|
||||
// }
|
||||
// }
|
||||
|
||||
@@ -1,366 +1,366 @@
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/models"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
"cpone/component/table"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentMasterMenuUserGroupV1(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterUserGroup templ.Component,
|
||||
paginationUserGroup templ.Component,
|
||||
modaladdform templ.Component,
|
||||
modalEditform templ.Component,
|
||||
modalDeleteform templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filterUserGroup
|
||||
// table content
|
||||
@tablecontent
|
||||
@paginationUserGroup
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border text-primary" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
// hx-on::after-request="showtoast()"
|
||||
// hx-on::reponse-error="cobaerror()"
|
||||
// hx-on::send-error="cobaerror()"
|
||||
@modaladdform
|
||||
@modalEditform
|
||||
@modalDeleteform
|
||||
// @modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSku()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRowV1(data []models.UserGroupV1,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.M_UserGroupCode }</td>
|
||||
<td>{ v.M_UserGroupName }</td>
|
||||
<td>
|
||||
@TableAction(v.M_UserGroupID, hxGetEdit, hxTargetEdit, hxSwapEdit, hxIncludeEdit, hxGetDelete, hxTargetDelete, hxSwapDelete, hxIncludeDelete)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
>
|
||||
// { "/dev/usergroupshoweditform?id=" + strconv.Itoa(v.M_UserGroupID) }
|
||||
// data-toggle="modal"
|
||||
// data-target={ "#dialogEdit" + strconv.Itoa(v.M_UserGroupID) }
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
id="btndeleteug"
|
||||
type="button"
|
||||
class=" btndeleteug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
>
|
||||
// hx-get={ "/dev/usergroupshowdeleteform?id=" + strconv.Itoa(v.M_UserGroupID) }
|
||||
// data-toggle="modal"
|
||||
// data-target={ "#dialogDelete" + strconv.Itoa(v.M_UserGroupID) }
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogDeleteActionV1() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDeleteV1() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSkuV1() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
</script>
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroupV1x() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroupV1x() {
|
||||
}
|
||||
|
||||
templ ShowMasterMenuUserGroupV1x(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
templ TableUserGroup(data []models.UserGroupV1, tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "USERGROUP", "AKSI"},
|
||||
[]string{"40%", "40%", "20%"},
|
||||
TableRowV1(data, hxGetEdit, hxTargetEdit, hxSwapEdit, hxIncludeEdit, hxGetDelete, hxTargetDelete, hxSwapDelete, hxIncludeDelete))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ SwapTableUserGroup(pagination templ.Component, table templ.Component) {
|
||||
@pagination
|
||||
@table
|
||||
}
|
||||
|
||||
templ UserGroupForm(data models.UserGroupFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const boxes = document.querySelectorAll('.btnaddact');
|
||||
|
||||
for (let i = 0; i < boxes.length; i++) {
|
||||
boxes[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const boxes = document.querySelectorAll('.btnaddact');
|
||||
|
||||
for (let i = 0; i < boxes.length; i++) {
|
||||
boxes[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/models"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
"cpone/component/table"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentMasterMenuUserGroupV1(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterUserGroup templ.Component,
|
||||
paginationUserGroup templ.Component,
|
||||
modaladdform templ.Component,
|
||||
modalEditform templ.Component,
|
||||
modalDeleteform templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filterUserGroup
|
||||
// table content
|
||||
@tablecontent
|
||||
@paginationUserGroup
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border text-primary" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
// hx-on::after-request="showtoast()"
|
||||
// hx-on::reponse-error="cobaerror()"
|
||||
// hx-on::send-error="cobaerror()"
|
||||
@modaladdform
|
||||
@modalEditform
|
||||
@modalDeleteform
|
||||
// @modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSku()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRowV1(data []models.UserGroupV1,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.M_UserGroupCode }</td>
|
||||
<td>{ v.M_UserGroupName }</td>
|
||||
<td>
|
||||
@TableAction(v.M_UserGroupID, hxGetEdit, hxTargetEdit, hxSwapEdit, hxIncludeEdit, hxGetDelete, hxTargetDelete, hxSwapDelete, hxIncludeDelete)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
>
|
||||
// { "/dev/usergroupshoweditform?id=" + strconv.Itoa(v.M_UserGroupID) }
|
||||
// data-toggle="modal"
|
||||
// data-target={ "#dialogEdit" + strconv.Itoa(v.M_UserGroupID) }
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
id="btndeleteug"
|
||||
type="button"
|
||||
class=" btndeleteug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
>
|
||||
// hx-get={ "/dev/usergroupshowdeleteform?id=" + strconv.Itoa(v.M_UserGroupID) }
|
||||
// data-toggle="modal"
|
||||
// data-target={ "#dialogDelete" + strconv.Itoa(v.M_UserGroupID) }
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogDeleteActionV1() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDeleteV1() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSkuV1() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
</script>
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroupV1x() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroupV1x() {
|
||||
}
|
||||
|
||||
templ ShowMasterMenuUserGroupV1x(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
templ TableUserGroup(data []models.UserGroupV1, tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "USERGROUP", "AKSI"},
|
||||
[]string{"40%", "40%", "20%"},
|
||||
TableRowV1(data, hxGetEdit, hxTargetEdit, hxSwapEdit, hxIncludeEdit, hxGetDelete, hxTargetDelete, hxSwapDelete, hxIncludeDelete))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ SwapTableUserGroup(pagination templ.Component, table templ.Component) {
|
||||
@pagination
|
||||
@table
|
||||
}
|
||||
|
||||
templ UserGroupForm(data models.UserGroupFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const boxes = document.querySelectorAll('.btnaddact');
|
||||
|
||||
for (let i = 0; i < boxes.length; i++) {
|
||||
boxes[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const boxes = document.querySelectorAll('.btnaddact');
|
||||
|
||||
for (let i = 0; i < boxes.length; i++) {
|
||||
boxes[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,127 +1,127 @@
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
templ DialogNewBody(code string, name string, id string, codeErrorMsg string, nameErrorMsg string) {
|
||||
<div id="modalbdy">
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "id user group",
|
||||
Name: "usergroupid",
|
||||
Placeholder: "id user Group",
|
||||
Type: "hidden",
|
||||
Value: code,
|
||||
ErrorMsg: codeErrorMsg,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
ErrorMsg: codeErrorMsg,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
ErrorMsg: nameErrorMsg,
|
||||
})
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogNewBodyV1(inputId models.CustomTextFieldv2Prm,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputCode)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputName)
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleJSModalAddUG(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script HandleJSModalAddUGShow(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
}
|
||||
|
||||
templ DialogNewActionV1(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ HandleJSModalAddUG(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnaddact"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnaddact"
|
||||
>
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogNewAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseNew() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ BtnCloseNewV1(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ HandleJSModalAddUG(modalID) }
|
||||
class="close btnaddact"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
templ DialogNewBody(code string, name string, id string, codeErrorMsg string, nameErrorMsg string) {
|
||||
<div id="modalbdy">
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "id user group",
|
||||
Name: "usergroupid",
|
||||
Placeholder: "id user Group",
|
||||
Type: "hidden",
|
||||
Value: code,
|
||||
ErrorMsg: codeErrorMsg,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
ErrorMsg: codeErrorMsg,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
ErrorMsg: nameErrorMsg,
|
||||
})
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogNewBodyV1(inputId models.CustomTextFieldv2Prm,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputCode)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputName)
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleJSModalAddUG(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script HandleJSModalAddUGShow(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
}
|
||||
|
||||
templ DialogNewActionV1(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ HandleJSModalAddUG(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnaddact"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnaddact"
|
||||
>
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogNewAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseNew() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ BtnCloseNewV1(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ HandleJSModalAddUG(modalID) }
|
||||
class="close btnaddact"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
@@ -1,79 +1,79 @@
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
templ DialogEditForm(code string, name string) {
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
})
|
||||
}
|
||||
|
||||
templ DialogEditBody(code string, name string) {
|
||||
<div id="modalbdyEdit">
|
||||
@DialogEditForm(code, name)
|
||||
</div>
|
||||
<div>
|
||||
// <div class="text-center text-primary" id="modalLoadEdit" style="">
|
||||
// <div class="spinner-border" role="status"></div>
|
||||
// </div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ LoadingSpinner() {
|
||||
<div id="modalbdyEdit">
|
||||
<div class="text-center text-primary">
|
||||
<div class="spinner-border" role="status"></div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogEditAction() {
|
||||
<div>
|
||||
<button
|
||||
id="btledit"
|
||||
type="button"
|
||||
hx-swap="delete"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseEdit() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
templ DialogEditForm(code string, name string) {
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
})
|
||||
}
|
||||
|
||||
templ DialogEditBody(code string, name string) {
|
||||
<div id="modalbdyEdit">
|
||||
@DialogEditForm(code, name)
|
||||
</div>
|
||||
<div>
|
||||
// <div class="text-center text-primary" id="modalLoadEdit" style="">
|
||||
// <div class="spinner-border" role="status"></div>
|
||||
// </div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ LoadingSpinner() {
|
||||
<div id="modalbdyEdit">
|
||||
<div class="text-center text-primary">
|
||||
<div class="spinner-border" role="status"></div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogEditAction() {
|
||||
<div>
|
||||
<button
|
||||
id="btledit"
|
||||
type="button"
|
||||
hx-swap="delete"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseEdit() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
@@ -1,49 +1,49 @@
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ ListMasterUserGroupInitial(data []models.UserGroupV1) {
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>No.</th>
|
||||
<th>M_UserGroupCode</th>
|
||||
<th>M_UserGroupName</th>
|
||||
<th>M_UserGroupCreated</th>
|
||||
<th>M_UserGroupLastUpdated</th>
|
||||
<th>M_UserGroupIsActive</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
if len(data) == 0 {
|
||||
<td colspan="5">Tidak ada data</td>
|
||||
} else {
|
||||
for _, d := range data {
|
||||
<tr>
|
||||
<td>{ d.Nomor }</td>
|
||||
<td>{ d.M_UserGroupCode }</td>
|
||||
<td>{ d.M_UserGroupName }</td>
|
||||
<td>{ d.M_UserGroupCreated }</td>
|
||||
<td>{ d.M_UserGroupLastUpdated }</td>
|
||||
<td>{ d.M_UserGroupIsActive }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroupV1() {
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroupV1() {
|
||||
}
|
||||
|
||||
templ ShowMasterMenuUserGroupV1(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package mastermenuusergroup
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ ListMasterUserGroupInitial(data []models.UserGroupV1) {
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>No.</th>
|
||||
<th>M_UserGroupCode</th>
|
||||
<th>M_UserGroupName</th>
|
||||
<th>M_UserGroupCreated</th>
|
||||
<th>M_UserGroupLastUpdated</th>
|
||||
<th>M_UserGroupIsActive</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
if len(data) == 0 {
|
||||
<td colspan="5">Tidak ada data</td>
|
||||
} else {
|
||||
for _, d := range data {
|
||||
<tr>
|
||||
<td>{ d.Nomor }</td>
|
||||
<td>{ d.M_UserGroupCode }</td>
|
||||
<td>{ d.M_UserGroupName }</td>
|
||||
<td>{ d.M_UserGroupCreated }</td>
|
||||
<td>{ d.M_UserGroupLastUpdated }</td>
|
||||
<td>{ d.M_UserGroupIsActive }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroupV1() {
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroupV1() {
|
||||
}
|
||||
|
||||
templ ShowMasterMenuUserGroupV1(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,215 +1,215 @@
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/component/breadcrumbadmin"
|
||||
"cpone/models"
|
||||
"cpone/component/table"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
"cpone/component/pagination"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentMasterMenuUserGroup(ugData []models.UserGroup, contentID string) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumadmin.MainBreadcrumbAdmin()
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target="#dialogNew"
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button type="button" class="btn btn-primary btn-block">Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id={ contentID }>
|
||||
@tablecomponent.Table([]string{"KODE", "USERGROUP", "AKSI"}, []string{"40%", "40%", "20%"}, TableRow(ugData), pagination.Pagination(20, 1, "dev/usergroup/pagination", contentID))
|
||||
</div>
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
@modalcomponent.Modal("dialogNew", "New - User Group", DialogNewBody("", "", "", ""), DialogNewAction(), BtnCloseNew())
|
||||
@modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSku()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRow(data []models.UserGroup) {
|
||||
// /usergroup/edit
|
||||
// <a
|
||||
// id="btneditug"
|
||||
// type="button"
|
||||
// class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
// onclick="htmx.trigger('#btneditug', 'htmx:abort')"
|
||||
// hx-target="#modalbdyEdit"
|
||||
// hx-swap="innerHTML"
|
||||
// hx-get={ "/client/usergroup/edit?id=" + strconv.Itoa(v.UserGroupID) }
|
||||
// hx-on::before-request="ShowLoading()"
|
||||
// hx-on::after-request="ShowForm()"
|
||||
// data-toggle="modal"
|
||||
// data-target="#dialogEdit"
|
||||
// >
|
||||
// Edit
|
||||
// </a>
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.UserGroupKode }</td>
|
||||
<td>{ v.UserGroupName }</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogEdit" + strconv.Itoa(v.UserGroupID) }
|
||||
>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogDelete" + strconv.Itoa(v.UserGroupID) }
|
||||
>Hapus</a>
|
||||
@modalcomponent.Modal("dialogEdit"+strconv.Itoa(v.UserGroupID),
|
||||
"Edit - User Group",
|
||||
DialogEditBody(v.UserGroupKode, v.UserGroupName),
|
||||
DialogEditAction(),
|
||||
BtnCloseNew())
|
||||
@modalcomponent.ModalConfirmation(
|
||||
"dialogDelete"+strconv.Itoa(v.UserGroupID),
|
||||
"Konfirmasi",
|
||||
"Apakah anda yakin menghapus user group berikut ?", BtnCloseDelete(),
|
||||
[]string{"Kode", "User Group"}, []string{v.UserGroupKode, v.UserGroupName}, DialogDeleteAction())
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ DialogDeleteAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDelete() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSku() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
}
|
||||
|
||||
templ Pagination() {
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap">
|
||||
<div class="d-flex flex-wrap py-2 mr-3">
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">23</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light btn-hover-primary active mr-2 my-1">24</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">25</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">26</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">27</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">28</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-next icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-next icon-xs"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroup() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroup() {
|
||||
}
|
||||
|
||||
// templ ShowMasterMenuUserGroup(title string, cmp templ.Component, css templ.Component, js templ.Component, dataMenu []services.MasterMenu, dataUser models.User) {
|
||||
// @layout.CorporateLayout(title, css, js, dataMenu, dataUser) {
|
||||
// @cmp
|
||||
// }
|
||||
// }
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/component/breadcrumbadmin"
|
||||
"cpone/models"
|
||||
"cpone/component/table"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
"cpone/component/pagination"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentMasterMenuUserGroup(ugData []models.UserGroup, contentID string) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumadmin.MainBreadcrumbAdmin()
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target="#dialogNew"
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button type="button" class="btn btn-primary btn-block">Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id={ contentID }>
|
||||
@tablecomponent.Table([]string{"KODE", "USERGROUP", "AKSI"}, []string{"40%", "40%", "20%"}, TableRow(ugData), pagination.Pagination(20, 1, "dev/usergroup/pagination", contentID))
|
||||
</div>
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
@modalcomponent.Modal("dialogNew", "New - User Group", DialogNewBody("", "", "", ""), DialogNewAction(), BtnCloseNew())
|
||||
@modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSku()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRow(data []models.UserGroup) {
|
||||
// /usergroup/edit
|
||||
// <a
|
||||
// id="btneditug"
|
||||
// type="button"
|
||||
// class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
// onclick="htmx.trigger('#btneditug', 'htmx:abort')"
|
||||
// hx-target="#modalbdyEdit"
|
||||
// hx-swap="innerHTML"
|
||||
// hx-get={ "/client/usergroup/edit?id=" + strconv.Itoa(v.UserGroupID) }
|
||||
// hx-on::before-request="ShowLoading()"
|
||||
// hx-on::after-request="ShowForm()"
|
||||
// data-toggle="modal"
|
||||
// data-target="#dialogEdit"
|
||||
// >
|
||||
// Edit
|
||||
// </a>
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.UserGroupKode }</td>
|
||||
<td>{ v.UserGroupName }</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogEdit" + strconv.Itoa(v.UserGroupID) }
|
||||
>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogDelete" + strconv.Itoa(v.UserGroupID) }
|
||||
>Hapus</a>
|
||||
@modalcomponent.Modal("dialogEdit"+strconv.Itoa(v.UserGroupID),
|
||||
"Edit - User Group",
|
||||
DialogEditBody(v.UserGroupKode, v.UserGroupName),
|
||||
DialogEditAction(),
|
||||
BtnCloseNew())
|
||||
@modalcomponent.ModalConfirmation(
|
||||
"dialogDelete"+strconv.Itoa(v.UserGroupID),
|
||||
"Konfirmasi",
|
||||
"Apakah anda yakin menghapus user group berikut ?", BtnCloseDelete(),
|
||||
[]string{"Kode", "User Group"}, []string{v.UserGroupKode, v.UserGroupName}, DialogDeleteAction())
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ DialogDeleteAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDelete() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSku() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
}
|
||||
|
||||
templ Pagination() {
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap">
|
||||
<div class="d-flex flex-wrap py-2 mr-3">
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">23</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light btn-hover-primary active mr-2 my-1">24</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">25</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">26</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">27</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">28</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-next icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-next icon-xs"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroup() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroup() {
|
||||
}
|
||||
|
||||
// templ ShowMasterMenuUserGroup(title string, cmp templ.Component, css templ.Component, js templ.Component, dataMenu []services.MasterMenu, dataUser models.User) {
|
||||
// @layout.CorporateLayout(title, css, js, dataMenu, dataUser) {
|
||||
// @cmp
|
||||
// }
|
||||
// }
|
||||
|
||||
@@ -1,199 +1,199 @@
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/models"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentMasterMenuUserGroupV1(contentID string, breadcrumb templ.Component, tablecontent templ.Component, inputansearch templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target="#dialogNew"
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button type="button" class="btn btn-primary btn-block">Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
// inputan
|
||||
@inputansearch
|
||||
<div class="mt-7"></div>
|
||||
// table content
|
||||
@tablecontent
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
@modalcomponent.Modal("dialogNew", "New - User Group", DialogNewBody("", "", "coba", ""), DialogNewAction(), BtnCloseNew())
|
||||
@modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSku()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRowV1(data []models.UserGroupV1) {
|
||||
// /usergroup/edit
|
||||
// <a
|
||||
// id="btneditug"
|
||||
// type="button"
|
||||
// class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
// onclick="htmx.trigger('#btneditug', 'htmx:abort')"
|
||||
// hx-target="#modalbdyEdit"
|
||||
// hx-swap="innerHTML"
|
||||
// hx-get={ "/client/usergroup/edit?id=" + strconv.Itoa(v.UserGroupID) }
|
||||
// hx-on::before-request="ShowLoading()"
|
||||
// hx-on::after-request="ShowForm()"
|
||||
// data-toggle="modal"
|
||||
// data-target="#dialogEdit"
|
||||
// >
|
||||
// Edit
|
||||
// </a>
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.M_UserGroupCode }</td>
|
||||
<td>{ v.M_UserGroupName }</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogEdit" + strconv.Itoa(v.M_UserGroupID) }
|
||||
>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogDelete" + strconv.Itoa(v.M_UserGroupID) }
|
||||
>Hapus</a>
|
||||
@modalcomponent.Modal("dialogEdit"+strconv.Itoa(v.M_UserGroupID),
|
||||
"Edit - User Group",
|
||||
DialogEditBody(v.M_UserGroupCode, v.M_UserGroupName),
|
||||
DialogEditAction(),
|
||||
BtnCloseNew())
|
||||
@modalcomponent.ModalConfirmation(
|
||||
"dialogDelete"+strconv.Itoa(v.M_UserGroupID),
|
||||
"Konfirmasi",
|
||||
"Apakah anda yakin menghapus user group berikut ?", BtnCloseDelete(),
|
||||
[]string{"Kode", "User Group"}, []string{v.M_UserGroupCode, v.M_UserGroupName}, DialogDeleteAction())
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ DialogDeleteActionV1() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDeleteV1() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSkuV1() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroupV1x() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroupV1x() {
|
||||
}
|
||||
|
||||
templ ShowMasterMenuUserGroupV1x(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/models"
|
||||
"cpone/component/modal"
|
||||
"strconv"
|
||||
)
|
||||
|
||||
// "cpone/component/sidebar_user_profile"
|
||||
templ ContentMasterMenuUserGroupV1(contentID string, breadcrumb templ.Component, tablecontent templ.Component, inputansearch templ.Component) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target="#dialogNew"
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button type="button" class="btn btn-primary btn-block">Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
// inputan
|
||||
@inputansearch
|
||||
<div class="mt-7"></div>
|
||||
// table content
|
||||
@tablecontent
|
||||
<div class="d-flex justify-content-center text-primary">
|
||||
<div class="htmx-indicator spinner-border" role="status" id="indicator">
|
||||
<span class="sr-only"></span>
|
||||
</div>
|
||||
</div>
|
||||
@modalcomponent.Modal("dialogNew", "New - User Group", DialogNewBody("", "", "coba", ""), DialogNewAction(), BtnCloseNew())
|
||||
@modalcomponent.Modal("dialogEdit", "Edit - User Group", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
|
||||
@JSku()
|
||||
</div>
|
||||
}
|
||||
|
||||
templ TableRowV1(data []models.UserGroupV1) {
|
||||
// /usergroup/edit
|
||||
// <a
|
||||
// id="btneditug"
|
||||
// type="button"
|
||||
// class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
// onclick="htmx.trigger('#btneditug', 'htmx:abort')"
|
||||
// hx-target="#modalbdyEdit"
|
||||
// hx-swap="innerHTML"
|
||||
// hx-get={ "/client/usergroup/edit?id=" + strconv.Itoa(v.UserGroupID) }
|
||||
// hx-on::before-request="ShowLoading()"
|
||||
// hx-on::after-request="ShowForm()"
|
||||
// data-toggle="modal"
|
||||
// data-target="#dialogEdit"
|
||||
// >
|
||||
// Edit
|
||||
// </a>
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.M_UserGroupCode }</td>
|
||||
<td>{ v.M_UserGroupName }</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
id="btneditug"
|
||||
type="button"
|
||||
class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogEdit" + strconv.Itoa(v.M_UserGroupID) }
|
||||
>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
|
||||
data-toggle="modal"
|
||||
data-target={ "#dialogDelete" + strconv.Itoa(v.M_UserGroupID) }
|
||||
>Hapus</a>
|
||||
@modalcomponent.Modal("dialogEdit"+strconv.Itoa(v.M_UserGroupID),
|
||||
"Edit - User Group",
|
||||
DialogEditBody(v.M_UserGroupCode, v.M_UserGroupName),
|
||||
DialogEditAction(),
|
||||
BtnCloseNew())
|
||||
@modalcomponent.ModalConfirmation(
|
||||
"dialogDelete"+strconv.Itoa(v.M_UserGroupID),
|
||||
"Konfirmasi",
|
||||
"Apakah anda yakin menghapus user group berikut ?", BtnCloseDelete(),
|
||||
[]string{"Kode", "User Group"}, []string{v.M_UserGroupCode, v.M_UserGroupName}, DialogDeleteAction())
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ DialogDeleteActionV1() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseDeleteV1() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ JSkuV1() {
|
||||
<script>
|
||||
function ShowLoading(evt) {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:block !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
console.log(evt);
|
||||
}
|
||||
function ShowForm() {
|
||||
document
|
||||
.getElementById("modalLoadEdit")
|
||||
.setAttribute("style", "display:none !important;");
|
||||
document
|
||||
.getElementById("modalbdyEdit")
|
||||
.setAttribute("style", "display:block !important;;");
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroupV1x() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroupV1x() {
|
||||
}
|
||||
|
||||
templ ShowMasterMenuUserGroupV1x(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,85 +1,85 @@
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
templ DialogNewBody(code string, name string, codeErrorMsg string, nameErrorMsg string) {
|
||||
<div id="modalbdy">
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
ErrorMsg: codeErrorMsg,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
ErrorMsg: nameErrorMsg,
|
||||
})
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogErrorBody(code string, name string) {
|
||||
<div id="testttt" class="p-6" hx-swap-oob="#testttt">
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group sasa",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
ErrorMsg: "error",
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
})
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogNewAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseNew() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ CobaSwapOOB(code string, name string, errorCode string, errorName string) {
|
||||
@DialogNewBody(code, name, errorCode, errorName)
|
||||
@DialogErrorBody(code, name)
|
||||
}
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
templ DialogNewBody(code string, name string, codeErrorMsg string, nameErrorMsg string) {
|
||||
<div id="modalbdy">
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
ErrorMsg: codeErrorMsg,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
ErrorMsg: nameErrorMsg,
|
||||
})
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogErrorBody(code string, name string) {
|
||||
<div id="testttt" class="p-6" hx-swap-oob="#testttt">
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group sasa",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
ErrorMsg: "error",
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
})
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogNewAction() {
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseNew() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ CobaSwapOOB(code string, name string, errorCode string, errorName string) {
|
||||
@DialogNewBody(code, name, errorCode, errorName)
|
||||
@DialogErrorBody(code, name)
|
||||
}
|
||||
|
||||
@@ -1,79 +1,79 @@
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
templ DialogEditForm(code string, name string) {
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
})
|
||||
}
|
||||
|
||||
templ DialogEditBody(code string, name string) {
|
||||
<div id="modalbdyEdit">
|
||||
@DialogEditForm(code, name)
|
||||
</div>
|
||||
<div>
|
||||
// <div class="text-center text-primary" id="modalLoadEdit" style="">
|
||||
// <div class="spinner-border" role="status"></div>
|
||||
// </div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ LoadingSpinner() {
|
||||
<div id="modalbdyEdit">
|
||||
<div class="text-center text-primary">
|
||||
<div class="spinner-border" role="status"></div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogEditAction() {
|
||||
<div>
|
||||
<button
|
||||
id="btledit"
|
||||
type="button"
|
||||
hx-swap="delete"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseEdit() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/component/customtextfield"
|
||||
)
|
||||
|
||||
templ DialogEditForm(code string, name string) {
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Kode user group",
|
||||
Name: "usergroupcode",
|
||||
Placeholder: "Kode user Group",
|
||||
Type: "text",
|
||||
Value: code,
|
||||
})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
models.CustomTextFieldv2Prm{
|
||||
Label: "Nama User Group",
|
||||
Name: "usergroupname",
|
||||
Placeholder: "Nama User Group",
|
||||
Type: "text",
|
||||
Value: name,
|
||||
})
|
||||
}
|
||||
|
||||
templ DialogEditBody(code string, name string) {
|
||||
<div id="modalbdyEdit">
|
||||
@DialogEditForm(code, name)
|
||||
</div>
|
||||
<div>
|
||||
// <div class="text-center text-primary" id="modalLoadEdit" style="">
|
||||
// <div class="spinner-border" role="status"></div>
|
||||
// </div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ LoadingSpinner() {
|
||||
<div id="modalbdyEdit">
|
||||
<div class="text-center text-primary">
|
||||
<div class="spinner-border" role="status"></div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ DialogEditAction() {
|
||||
<div>
|
||||
<button
|
||||
id="btledit"
|
||||
type="button"
|
||||
hx-swap="delete"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
|
||||
>
|
||||
Save changes
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseEdit() {
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
hx-target="#modalbdyEdit"
|
||||
onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
@@ -1,49 +1,49 @@
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ ListMasterUserGroupInitial(data []models.UserGroupV1) {
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>No.</th>
|
||||
<th>M_UserGroupCode</th>
|
||||
<th>M_UserGroupName</th>
|
||||
<th>M_UserGroupCreated</th>
|
||||
<th>M_UserGroupLastUpdated</th>
|
||||
<th>M_UserGroupIsActive</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
if len(data) == 0 {
|
||||
<td colspan="5">Tidak ada data</td>
|
||||
} else {
|
||||
for _, d := range data {
|
||||
<tr>
|
||||
<td>{ d.Nomor }</td>
|
||||
<td>{ d.M_UserGroupCode }</td>
|
||||
<td>{ d.M_UserGroupName }</td>
|
||||
<td>{ d.M_UserGroupCreated }</td>
|
||||
<td>{ d.M_UserGroupLastUpdated }</td>
|
||||
<td>{ d.M_UserGroupIsActive }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroupV1() {
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroupV1() {
|
||||
}
|
||||
|
||||
templ ShowMasterMenuUserGroupV1(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package mastermenuusergrouptryandy
|
||||
|
||||
import (
|
||||
"cpone/models"
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ ListMasterUserGroupInitial(data []models.UserGroupV1) {
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>No.</th>
|
||||
<th>M_UserGroupCode</th>
|
||||
<th>M_UserGroupName</th>
|
||||
<th>M_UserGroupCreated</th>
|
||||
<th>M_UserGroupLastUpdated</th>
|
||||
<th>M_UserGroupIsActive</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
if len(data) == 0 {
|
||||
<td colspan="5">Tidak ada data</td>
|
||||
} else {
|
||||
for _, d := range data {
|
||||
<tr>
|
||||
<td>{ d.Nomor }</td>
|
||||
<td>{ d.M_UserGroupCode }</td>
|
||||
<td>{ d.M_UserGroupName }</td>
|
||||
<td>{ d.M_UserGroupCreated }</td>
|
||||
<td>{ d.M_UserGroupLastUpdated }</td>
|
||||
<td>{ d.M_UserGroupIsActive }</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
|
||||
templ JsMasterMenuUserGroupV1() {
|
||||
}
|
||||
|
||||
templ CssMasterMenuUserGroupV1() {
|
||||
}
|
||||
|
||||
templ ShowMasterMenuUserGroupV1(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,134 +1,134 @@
|
||||
package dev_mcudaftarpeserta
|
||||
|
||||
import "cpone/layout"
|
||||
|
||||
templ McuDaftarPesertaScreen() {
|
||||
<div>
|
||||
<table class="table table-hover table-borderless">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" width="5%">NO LAB</th>
|
||||
<th scope="col" width="25%">NAMA</th>
|
||||
<th scope="col" width="10%">JENIS KELAMIN</th>
|
||||
<th scope="col" width="10%">UMUR</th>
|
||||
<th scope="col" width="35%">KESIMPULAN</th>
|
||||
<th scope="col" width="15%" s>AKSI</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>21304</td>
|
||||
<td>Abraham Kurniawan</td>
|
||||
<td>Laki - Laki</td>
|
||||
<td>24</td>
|
||||
<td>
|
||||
<div class="row">
|
||||
<div class="col-2">
|
||||
<span class="label-text fit"> Fit </span>
|
||||
<!-- <span class="label label-inline label-text"> FIT </span> -->
|
||||
</div>
|
||||
<div class="col-10 kesimpulan-desc"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div>
|
||||
<a
|
||||
class="btn btn-icon"
|
||||
onclick="ShowModal('Abraham Kurniawan','21304')"
|
||||
>
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons-solid:document-text"
|
||||
></span>
|
||||
</a>
|
||||
<a href="mcu/hasil-lab.html" class="btn btn-icon">
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons-solid:pencil"
|
||||
></span>
|
||||
</a>
|
||||
<a
|
||||
class="btn btn-icon"
|
||||
onclick="ShowModalAkses('Abraham@gmail.com','Abraham Kurniawan','unchecked')"
|
||||
>
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons:shield-exclamation-16-solid"
|
||||
></span>
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>21305</td>
|
||||
<td>Anastasia Claudia</td>
|
||||
<td>Perempuan</td>
|
||||
<td>24</td>
|
||||
<td>
|
||||
<div class="row">
|
||||
<div class="col-2 col-xl-2 col-lg-2 col-md-12 col-sm-12">
|
||||
<span class="label-text unfit"> Unfit </span>
|
||||
<!-- <span class="label label-inline label-text"> FIT </span> -->
|
||||
</div>
|
||||
<div
|
||||
class="col-10 col-xl-10 col-lg-10 col-md-12 col-sm-12 kesimpulan-desc"
|
||||
>
|
||||
Anti HBs (Positif : 752), Cholesterol sedikit meningkat
|
||||
(218), LDL Cholesterol Direct meningkat (173)
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div>
|
||||
<!-- data-target="#exampleModalSizeLg" -->
|
||||
<a
|
||||
class="btn btn-icon"
|
||||
data-toggle="modal"
|
||||
onclick="ShowModal('Anastasia Claudia', '21305')"
|
||||
>
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons-solid:document-text"
|
||||
></span>
|
||||
</a>
|
||||
<a href="mcu/hasil-lab.html" class="btn btn-icon">
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons-solid:pencil"
|
||||
></span>
|
||||
</a>
|
||||
<a
|
||||
class="btn btn-icon"
|
||||
onclick="ShowModalAkses('Anastasia@gmail.com','Anastasia Claudia','checked')"
|
||||
>
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons:shield-exclamation-16-solid"
|
||||
></span>
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSMcuDaftarPeserta() {
|
||||
|
||||
}
|
||||
|
||||
templ JsMcuDaftarPeserta() {
|
||||
|
||||
}
|
||||
|
||||
templ ShowMcuDafterPeserta(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
package dev_mcudaftarpeserta
|
||||
|
||||
import "cpone/layout"
|
||||
|
||||
templ McuDaftarPesertaScreen() {
|
||||
<div>
|
||||
<table class="table table-hover table-borderless">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" width="5%">NO LAB</th>
|
||||
<th scope="col" width="25%">NAMA</th>
|
||||
<th scope="col" width="10%">JENIS KELAMIN</th>
|
||||
<th scope="col" width="10%">UMUR</th>
|
||||
<th scope="col" width="35%">KESIMPULAN</th>
|
||||
<th scope="col" width="15%" s>AKSI</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>21304</td>
|
||||
<td>Abraham Kurniawan</td>
|
||||
<td>Laki - Laki</td>
|
||||
<td>24</td>
|
||||
<td>
|
||||
<div class="row">
|
||||
<div class="col-2">
|
||||
<span class="label-text fit"> Fit </span>
|
||||
<!-- <span class="label label-inline label-text"> FIT </span> -->
|
||||
</div>
|
||||
<div class="col-10 kesimpulan-desc"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div>
|
||||
<a
|
||||
class="btn btn-icon"
|
||||
onclick="ShowModal('Abraham Kurniawan','21304')"
|
||||
>
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons-solid:document-text"
|
||||
></span>
|
||||
</a>
|
||||
<a href="mcu/hasil-lab.html" class="btn btn-icon">
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons-solid:pencil"
|
||||
></span>
|
||||
</a>
|
||||
<a
|
||||
class="btn btn-icon"
|
||||
onclick="ShowModalAkses('Abraham@gmail.com','Abraham Kurniawan','unchecked')"
|
||||
>
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons:shield-exclamation-16-solid"
|
||||
></span>
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>21305</td>
|
||||
<td>Anastasia Claudia</td>
|
||||
<td>Perempuan</td>
|
||||
<td>24</td>
|
||||
<td>
|
||||
<div class="row">
|
||||
<div class="col-2 col-xl-2 col-lg-2 col-md-12 col-sm-12">
|
||||
<span class="label-text unfit"> Unfit </span>
|
||||
<!-- <span class="label label-inline label-text"> FIT </span> -->
|
||||
</div>
|
||||
<div
|
||||
class="col-10 col-xl-10 col-lg-10 col-md-12 col-sm-12 kesimpulan-desc"
|
||||
>
|
||||
Anti HBs (Positif : 752), Cholesterol sedikit meningkat
|
||||
(218), LDL Cholesterol Direct meningkat (173)
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div>
|
||||
<!-- data-target="#exampleModalSizeLg" -->
|
||||
<a
|
||||
class="btn btn-icon"
|
||||
data-toggle="modal"
|
||||
onclick="ShowModal('Anastasia Claudia', '21305')"
|
||||
>
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons-solid:document-text"
|
||||
></span>
|
||||
</a>
|
||||
<a href="mcu/hasil-lab.html" class="btn btn-icon">
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons-solid:pencil"
|
||||
></span>
|
||||
</a>
|
||||
<a
|
||||
class="btn btn-icon"
|
||||
onclick="ShowModalAkses('Anastasia@gmail.com','Anastasia Claudia','checked')"
|
||||
>
|
||||
<span
|
||||
class="iconify iconify-btn"
|
||||
data-icon="heroicons:shield-exclamation-16-solid"
|
||||
></span>
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSMcuDaftarPeserta() {
|
||||
|
||||
}
|
||||
|
||||
templ JsMcuDaftarPeserta() {
|
||||
|
||||
}
|
||||
|
||||
templ ShowMcuDafterPeserta(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
@@ -1,131 +1,131 @@
|
||||
package kelainanglobal
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
chart "cpone/component/chart"
|
||||
)
|
||||
|
||||
templ MainKelainanGlobal(divMcu string, dataMcu string, divFisik string, dataFisik string) {
|
||||
<div id="div-chart">
|
||||
@HeaderKelainanGlobal()
|
||||
<div class="d-flex flex-column flex-root bg-white mt-25">
|
||||
<!-- begin::Navbar -->
|
||||
<div class="d-flex justify-content-center ">
|
||||
<h3 class="mb-3 title">Data Persentase Kelainan Global</h3>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 text-center mb-10">
|
||||
@chart.ShowChart(divMcu, dataMcu)
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
@chart.ShowChart(divFisik, dataFisik)
|
||||
</div>
|
||||
</div>
|
||||
<!-- end::Navbar -->
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssKelainanGlobal() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsKelainanGlobal() {
|
||||
// echart
|
||||
<script src="assets/js/echarts-js/echart.min.js"></script>
|
||||
}
|
||||
|
||||
templ HeaderKelainanGlobal() {
|
||||
<!-- breadcrumb & icon tanya START -->
|
||||
<div class="row">
|
||||
<div class="col-11">
|
||||
<h1 class="title text-black" style="margin-bottom: 0">
|
||||
PT. Sadhana Abiyasa Sampoerna
|
||||
</h1>
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb" style="margin-bottom: 0">
|
||||
<li class="breadcrumb-item"><a href="#">Dashboard</a></li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="#">Employee Health Medical Analytic</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="#">PT. Sadhana Abiyasa Sampoerna</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item active" aria-current="page">
|
||||
Mcu Karyawan
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="col-1 align-content-center">
|
||||
<!-- align-content-center -->
|
||||
<div class="d-flex justify-content-end">
|
||||
<a href="#">
|
||||
<i class="fas fa-info-circle text-primary"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- breadcrumb & icon tanya END -->
|
||||
<div class="mt-10">
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_1">Peserta</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_2">Kelainan global</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_3">Kelainan Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_4">kelainan Non Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_5">kelainan Fisik</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_6">Kesimpulan & Saran</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href="#kt_tab_pane_7">Daftar Peserta</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ShowKelainanGlobal(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package kelainanglobal
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
chart "cpone/component/chart"
|
||||
)
|
||||
|
||||
templ MainKelainanGlobal(divMcu string, dataMcu string, divFisik string, dataFisik string) {
|
||||
<div id="div-chart">
|
||||
@HeaderKelainanGlobal()
|
||||
<div class="d-flex flex-column flex-root bg-white mt-25">
|
||||
<!-- begin::Navbar -->
|
||||
<div class="d-flex justify-content-center ">
|
||||
<h3 class="mb-3 title">Data Persentase Kelainan Global</h3>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 text-center mb-10">
|
||||
@chart.ShowChart(divMcu, dataMcu)
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
@chart.ShowChart(divFisik, dataFisik)
|
||||
</div>
|
||||
</div>
|
||||
<!-- end::Navbar -->
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssKelainanGlobal() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsKelainanGlobal() {
|
||||
// echart
|
||||
<script src="assets/js/echarts-js/echart.min.js"></script>
|
||||
}
|
||||
|
||||
templ HeaderKelainanGlobal() {
|
||||
<!-- breadcrumb & icon tanya START -->
|
||||
<div class="row">
|
||||
<div class="col-11">
|
||||
<h1 class="title text-black" style="margin-bottom: 0">
|
||||
PT. Sadhana Abiyasa Sampoerna
|
||||
</h1>
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb" style="margin-bottom: 0">
|
||||
<li class="breadcrumb-item"><a href="#">Dashboard</a></li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="#">Employee Health Medical Analytic</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="#">PT. Sadhana Abiyasa Sampoerna</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item active" aria-current="page">
|
||||
Mcu Karyawan
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="col-1 align-content-center">
|
||||
<!-- align-content-center -->
|
||||
<div class="d-flex justify-content-end">
|
||||
<a href="#">
|
||||
<i class="fas fa-info-circle text-primary"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- breadcrumb & icon tanya END -->
|
||||
<div class="mt-10">
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_1">Peserta</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_2">Kelainan global</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_3">Kelainan Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_4">kelainan Non Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_5">kelainan Fisik</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_6">Kesimpulan & Saran</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href="#kt_tab_pane_7">Daftar Peserta</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ShowKelainanGlobal(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,143 +1,143 @@
|
||||
package dev_detailmcu
|
||||
|
||||
import "cpone/layout"
|
||||
|
||||
templ DetailMcuScreen(
|
||||
breadcrumb templ.Component,
|
||||
content templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSDetailMcu() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JSDetailMcu() {
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
console.log("Before Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
console.log("After Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheError', function(event) {
|
||||
console.log("Error History Cache Error")
|
||||
console.log(event.detail.cause)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheMissError', function(event) {
|
||||
console.log("Error History Cache Miss Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.path)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:oobErrorNoTarget', function(event) {
|
||||
console.log("Error OOB No Target")
|
||||
console.log(event.detail.content)
|
||||
});
|
||||
document.addEventListener('htmx:onLoadError', function(event) {
|
||||
console.log("Error On Load")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.target)
|
||||
console.log(event.detail.exception)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:responseError', function(event) {
|
||||
console.log("Error Response")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sendError', function(event) {
|
||||
console.log("Error Send Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sseError', function(event) {
|
||||
console.log("Error Sse ")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.error)
|
||||
console.log(event.detail.source)
|
||||
});
|
||||
document.addEventListener('htmx:swapError', function(event) {
|
||||
console.log("Error Swap Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target Swap: "+event.detail.target)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:targetError', function(event) {
|
||||
console.log("Error target")
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target ID: "+event.detail.target)
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
templ ShowDetailMcu(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
package dev_detailmcu
|
||||
|
||||
import "cpone/layout"
|
||||
|
||||
templ DetailMcuScreen(
|
||||
breadcrumb templ.Component,
|
||||
content templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading-parent" class="rounded">
|
||||
@content
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading....</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSDetailMcu() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JSDetailMcu() {
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
console.log("Before Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
console.log("After Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheError', function(event) {
|
||||
console.log("Error History Cache Error")
|
||||
console.log(event.detail.cause)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheMissError', function(event) {
|
||||
console.log("Error History Cache Miss Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.path)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:oobErrorNoTarget', function(event) {
|
||||
console.log("Error OOB No Target")
|
||||
console.log(event.detail.content)
|
||||
});
|
||||
document.addEventListener('htmx:onLoadError', function(event) {
|
||||
console.log("Error On Load")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.target)
|
||||
console.log(event.detail.exception)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:responseError', function(event) {
|
||||
console.log("Error Response")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sendError', function(event) {
|
||||
console.log("Error Send Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sseError', function(event) {
|
||||
console.log("Error Sse ")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.error)
|
||||
console.log(event.detail.source)
|
||||
});
|
||||
document.addEventListener('htmx:swapError', function(event) {
|
||||
console.log("Error Swap Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target Swap: "+event.detail.target)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:targetError', function(event) {
|
||||
console.log("Error target")
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target ID: "+event.detail.target)
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
templ ShowDetailMcu(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component,
|
||||
) {
|
||||
@layout.DashboardLayout(title, css, js, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
@@ -1,132 +1,132 @@
|
||||
package mcupeserta
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
chart "cpone/component/chart"
|
||||
)
|
||||
|
||||
templ MainMcuPeserta(divPesertaMcu string, dataPesertaMcu string, divKepesertaanMcu string, dataKepesertaanMcu string, divPesertaMcuUmur string, dataPesertaMcuUmur string) {
|
||||
<div id="div-chart">
|
||||
@HeaderMcuPeserta()
|
||||
<div class="d-flex flex-column flex-root bg-white mt-25">
|
||||
<div class="d-flex justify-content-center ">
|
||||
<h3 class="mb-3 title">Data Kepesertaan MCU</h3>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 text-center mb-10">
|
||||
@chart.ShowChart(divPesertaMcu, dataPesertaMcu)
|
||||
</div>
|
||||
<div class="col-12 text-center mb-10">
|
||||
@chart.ShowChart(divKepesertaanMcu, dataKepesertaanMcu)
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
@chart.ShowChart(divPesertaMcuUmur, dataPesertaMcuUmur)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMcuPeserta() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMcuPeserta() {
|
||||
// echart
|
||||
<script src="assets/js/echarts-js/echart.min.js"></script>
|
||||
}
|
||||
|
||||
templ HeaderMcuPeserta() {
|
||||
<!-- breadcrumb & icon tanya START -->
|
||||
<div class="row">
|
||||
<div class="col-11">
|
||||
<h1 class="title text-black" style="margin-bottom: 0">
|
||||
PT. Sadhana Abiyasa Sampoerna
|
||||
</h1>
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb" style="margin-bottom: 0">
|
||||
<li class="breadcrumb-item"><a href="#">Dashboard</a></li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="#">Employee Health Medical Analytic</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="#">PT. Sadhana Abiyasa Sampoerna</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item active" aria-current="page">
|
||||
Mcu Karyawan
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="col-1 align-content-center">
|
||||
<!-- align-content-center -->
|
||||
<div class="d-flex justify-content-end">
|
||||
<a href="#">
|
||||
<i class="fas fa-info-circle text-primary"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- breadcrumb & icon tanya END -->
|
||||
<div class="mt-10">
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href="#kt_tab_pane_1">Peserta</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_2">Kelainan global</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_3">Kelainan Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_4">kelainan Non Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_5">kelainan Fisik</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_6">Kesimpulan & Saran</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_7">Daftar Peserta</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ShowMcuPeserta(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package mcupeserta
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
chart "cpone/component/chart"
|
||||
)
|
||||
|
||||
templ MainMcuPeserta(divPesertaMcu string, dataPesertaMcu string, divKepesertaanMcu string, dataKepesertaanMcu string, divPesertaMcuUmur string, dataPesertaMcuUmur string) {
|
||||
<div id="div-chart">
|
||||
@HeaderMcuPeserta()
|
||||
<div class="d-flex flex-column flex-root bg-white mt-25">
|
||||
<div class="d-flex justify-content-center ">
|
||||
<h3 class="mb-3 title">Data Kepesertaan MCU</h3>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 text-center mb-10">
|
||||
@chart.ShowChart(divPesertaMcu, dataPesertaMcu)
|
||||
</div>
|
||||
<div class="col-12 text-center mb-10">
|
||||
@chart.ShowChart(divKepesertaanMcu, dataKepesertaanMcu)
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
@chart.ShowChart(divPesertaMcuUmur, dataPesertaMcuUmur)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMcuPeserta() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMcuPeserta() {
|
||||
// echart
|
||||
<script src="assets/js/echarts-js/echart.min.js"></script>
|
||||
}
|
||||
|
||||
templ HeaderMcuPeserta() {
|
||||
<!-- breadcrumb & icon tanya START -->
|
||||
<div class="row">
|
||||
<div class="col-11">
|
||||
<h1 class="title text-black" style="margin-bottom: 0">
|
||||
PT. Sadhana Abiyasa Sampoerna
|
||||
</h1>
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb" style="margin-bottom: 0">
|
||||
<li class="breadcrumb-item"><a href="#">Dashboard</a></li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="#">Employee Health Medical Analytic</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item">
|
||||
<a href="#">PT. Sadhana Abiyasa Sampoerna</a>
|
||||
</li>
|
||||
<li class="breadcrumb-item active" aria-current="page">
|
||||
Mcu Karyawan
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="col-1 align-content-center">
|
||||
<!-- align-content-center -->
|
||||
<div class="d-flex justify-content-end">
|
||||
<a href="#">
|
||||
<i class="fas fa-info-circle text-primary"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- breadcrumb & icon tanya END -->
|
||||
<div class="mt-10">
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href="#kt_tab_pane_1">Peserta</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_2">Kelainan global</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_3">Kelainan Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_4">kelainan Non Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_5">kelainan Fisik</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_6">Kesimpulan & Saran</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_7">Daftar Peserta</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ShowMcuPeserta(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,67 +1,67 @@
|
||||
package dev_detailmcu
|
||||
|
||||
templ TabViewDetailMcu(
|
||||
id string,
|
||||
) {
|
||||
<div>
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href="#kt_tab_pane_1">Peserta</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_2">Kelainan global</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_3">Kelainan Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_4">kelainan Non Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_5">kelainan Fisik</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_6" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkesimpulan"} hx-target="#tabkesimpulan">Kesimpulan</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_7" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabdaftarpeserta"} hx-target="#tabdaftarpeserta">Daftar Peserta</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="myTabContent">
|
||||
<div class="tab-pane fade show active" id="kt_tab_pane_1" role="tabpanel" aria-labelledby="kt_tab_pane_2" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_001.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_2" role="tabpanel" aria-labelledby="kt_tab_pane_2" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_002.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_3" role="tabpanel" aria-labelledby="kt_tab_pane_3" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_003.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_4" role="tabpanel" aria-labelledby="kt_tab_pane_4" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_004.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_5" role="tabpanel" aria-labelledby="kt_tab_pane_5" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_005.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_6" role="tabpanel" aria-labelledby="kt_tab_pane_6">
|
||||
<div id="tabkesimpulan">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_7" role="tabpanel" aria-labelledby="kt_tab_pane_7">
|
||||
<div id="tabdaftarpeserta">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
// <embed
|
||||
// type="application/x-google-chrome-pdf"
|
||||
// src="chrome-extension://mhjfbmdgcfjbbpaeojofohoefgiehjai/c8a5f314-4b1f-4d80-bc24-ea068d6b0763"
|
||||
// original-url="https://devcpone.aplikasi.web.id/birt/run?_report=report/one/mcu/rpt_mcu_graph_001.rptdesign&_format=pdf&PID=2&username=adhi&tm=1717726294764"
|
||||
// background-color="4283586137"
|
||||
// javascript="allow" full-frame=""
|
||||
// />
|
||||
// <iframe src="https://devcpone.aplikasi.web.id/birt/run?_report=report/one/mcu/rpt_mcu_graph_001.rptdesign&_format=pdf&PID=2&username=adhi&tm=1717726294764"
|
||||
// style="width:600px; height:500px;" frameborder="0"></iframe>
|
||||
package dev_detailmcu
|
||||
|
||||
templ TabViewDetailMcu(
|
||||
id string,
|
||||
) {
|
||||
<div>
|
||||
<ul class="nav nav-tabs nav-tabs-line">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href="#kt_tab_pane_1">Peserta</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_2">Kelainan global</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_3">Kelainan Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_4">kelainan Non Lab</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_5">kelainan Fisik</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_6" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabkesimpulan"} hx-target="#tabkesimpulan">Kesimpulan</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#kt_tab_pane_7" hx-get={"/corp/dashboard_pic/detail/" + id +"/tabdaftarpeserta"} hx-target="#tabdaftarpeserta">Daftar Peserta</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tab-content mt-5" id="myTabContent">
|
||||
<div class="tab-pane fade show active" id="kt_tab_pane_1" role="tabpanel" aria-labelledby="kt_tab_pane_2" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_001.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_2" role="tabpanel" aria-labelledby="kt_tab_pane_2" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_002.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_3" role="tabpanel" aria-labelledby="kt_tab_pane_3" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_003.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_4" role="tabpanel" aria-labelledby="kt_tab_pane_4" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_004.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_5" role="tabpanel" aria-labelledby="kt_tab_pane_5" style="height: 800px;">
|
||||
<object data="https://devcpone.aplikasi.web.id/birt/run?__report=report/one/mcu/rpt_mcu_graph_005.rptdesign&__format=pdf&PID=2&username=adhi&tm=1717726294764" type="application/pdf" width="100%" height="100%"></object>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_6" role="tabpanel" aria-labelledby="kt_tab_pane_6">
|
||||
<div id="tabkesimpulan">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="kt_tab_pane_7" role="tabpanel" aria-labelledby="kt_tab_pane_7">
|
||||
<div id="tabdaftarpeserta">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
// <embed
|
||||
// type="application/x-google-chrome-pdf"
|
||||
// src="chrome-extension://mhjfbmdgcfjbbpaeojofohoefgiehjai/c8a5f314-4b1f-4d80-bc24-ea068d6b0763"
|
||||
// original-url="https://devcpone.aplikasi.web.id/birt/run?_report=report/one/mcu/rpt_mcu_graph_001.rptdesign&_format=pdf&PID=2&username=adhi&tm=1717726294764"
|
||||
// background-color="4283586137"
|
||||
// javascript="allow" full-frame=""
|
||||
// />
|
||||
// <iframe src="https://devcpone.aplikasi.web.id/birt/run?_report=report/one/mcu/rpt_mcu_graph_001.rptdesign&_format=pdf&PID=2&username=adhi&tm=1717726294764"
|
||||
// style="width:600px; height:500px;" frameborder="0"></iframe>
|
||||
|
||||
@@ -1,265 +1,265 @@
|
||||
package dev_mdbahanview
|
||||
|
||||
import "cpone/layout"
|
||||
import "cpone/models"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/component/customdropdown"
|
||||
import "strconv"
|
||||
|
||||
templ MdBahanScreen(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterComponent templ.Component,
|
||||
pagination templ.Component,
|
||||
dialogAddCmp templ.Component,
|
||||
dialogEditCmp templ.Component,
|
||||
dialogDeleteCmp templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading-parent" class=" rounded">
|
||||
@filterComponent
|
||||
@tablecontent
|
||||
@pagination
|
||||
<div id="loading-child" class=" rounded bg-transparent">
|
||||
// <div class="spinner spinner-lg spinner-primary"></div>
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
@dialogAddCmp
|
||||
@dialogEditCmp
|
||||
@dialogDeleteCmp
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMdUserGroup() {
|
||||
}
|
||||
|
||||
templ JsMdBahan() {
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
console.log("Before Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
console.log("After Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheError', function(event) {
|
||||
console.log("Error History Cache Error")
|
||||
console.log(event.detail.cause)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheMissError', function(event) {
|
||||
console.log("Error History Cache Miss Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.path)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:oobErrorNoTarget', function(event) {
|
||||
console.log("Error OOB No Target")
|
||||
console.log(event.detail.content)
|
||||
});
|
||||
document.addEventListener('htmx:onLoadError', function(event) {
|
||||
console.log("Error On Load")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.target)
|
||||
console.log(event.detail.exception)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:responseError', function(event) {
|
||||
console.log("Error Response")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sendError', function(event) {
|
||||
console.log("Error Send Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sseError', function(event) {
|
||||
console.log("Error Sse ")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.error)
|
||||
console.log(event.detail.source)
|
||||
});
|
||||
document.addEventListener('htmx:swapError', function(event) {
|
||||
console.log("Error Swap Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target Swap: "+event.detail.target)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:targetError', function(event) {
|
||||
console.log("Error target")
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target ID: "+event.detail.target)
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ MdBahanFilter(
|
||||
hxGet string,
|
||||
hxTrigger string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
hxTarget string,
|
||||
dataStation []models.TmpSampleStation,
|
||||
selectedIdStation int,
|
||||
hxBeforeRequest templ.ComponentScript,
|
||||
hxAfterRequest templ.ComponentScript,
|
||||
) {
|
||||
<div class="container p-0">
|
||||
<div class="row">
|
||||
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mb-2">
|
||||
<input
|
||||
id="filter-name"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="text"
|
||||
name="filtername"
|
||||
placeholder="Name/Kode"
|
||||
autocomplete="off"
|
||||
hx-target={ hxTarget }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-get={ hxGet }
|
||||
hx-swap={ hxSwap }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mb-2">
|
||||
@customdropdown.CustomDropdownFilter("filter-station",
|
||||
"filterstation",
|
||||
hxInclude,
|
||||
hxGet,
|
||||
hxSwap,
|
||||
hxTarget,
|
||||
"change",
|
||||
hxBeforeRequest,
|
||||
hxAfterRequest, ListItemStation(dataStation, selectedIdStation))
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ListItemStation(
|
||||
dataStation []models.TmpSampleStation,
|
||||
selectedIdStation int) {
|
||||
for _, v := range dataStation {
|
||||
if v.T_SampleStationID == selectedIdStation {
|
||||
<option value={ strconv.Itoa(v.T_SampleStationID) } selected="selected">{ v.T_SampleStationName }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.T_SampleStationID) }>{ v.T_SampleStationName }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
templ ShowMdBahanScreen(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package dev_mdbahanview
|
||||
|
||||
import "cpone/layout"
|
||||
import "cpone/models"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/component/customdropdown"
|
||||
import "strconv"
|
||||
|
||||
templ MdBahanScreen(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterComponent templ.Component,
|
||||
pagination templ.Component,
|
||||
dialogAddCmp templ.Component,
|
||||
dialogEditCmp templ.Component,
|
||||
dialogDeleteCmp templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading-parent" class=" rounded">
|
||||
@filterComponent
|
||||
@tablecontent
|
||||
@pagination
|
||||
<div id="loading-child" class=" rounded bg-transparent">
|
||||
// <div class="spinner spinner-lg spinner-primary"></div>
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
@dialogAddCmp
|
||||
@dialogEditCmp
|
||||
@dialogDeleteCmp
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMdUserGroup() {
|
||||
}
|
||||
|
||||
templ JsMdBahan() {
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
console.log("Before Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
console.log("After Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheError', function(event) {
|
||||
console.log("Error History Cache Error")
|
||||
console.log(event.detail.cause)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheMissError', function(event) {
|
||||
console.log("Error History Cache Miss Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.path)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:oobErrorNoTarget', function(event) {
|
||||
console.log("Error OOB No Target")
|
||||
console.log(event.detail.content)
|
||||
});
|
||||
document.addEventListener('htmx:onLoadError', function(event) {
|
||||
console.log("Error On Load")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.target)
|
||||
console.log(event.detail.exception)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:responseError', function(event) {
|
||||
console.log("Error Response")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sendError', function(event) {
|
||||
console.log("Error Send Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sseError', function(event) {
|
||||
console.log("Error Sse ")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.error)
|
||||
console.log(event.detail.source)
|
||||
});
|
||||
document.addEventListener('htmx:swapError', function(event) {
|
||||
console.log("Error Swap Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target Swap: "+event.detail.target)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:targetError', function(event) {
|
||||
console.log("Error target")
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target ID: "+event.detail.target)
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ MdBahanFilter(
|
||||
hxGet string,
|
||||
hxTrigger string,
|
||||
hxInclude string,
|
||||
hxSwap string,
|
||||
hxTarget string,
|
||||
dataStation []models.TmpSampleStation,
|
||||
selectedIdStation int,
|
||||
hxBeforeRequest templ.ComponentScript,
|
||||
hxAfterRequest templ.ComponentScript,
|
||||
) {
|
||||
<div class="container p-0">
|
||||
<div class="row">
|
||||
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mb-2">
|
||||
<input
|
||||
id="filter-name"
|
||||
class="form-control form-control-lg bg-field border-0 rounded-lg"
|
||||
type="text"
|
||||
name="filtername"
|
||||
placeholder="Name/Kode"
|
||||
autocomplete="off"
|
||||
hx-target={ hxTarget }
|
||||
hx-trigger={ hxTrigger }
|
||||
hx-include={ hxInclude }
|
||||
hx-get={ hxGet }
|
||||
hx-swap={ hxSwap }
|
||||
hx-on::before-request={ hxBeforeRequest }
|
||||
hx-on::after-request={ hxAfterRequest }
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 mb-2">
|
||||
@customdropdown.CustomDropdownFilter("filter-station",
|
||||
"filterstation",
|
||||
hxInclude,
|
||||
hxGet,
|
||||
hxSwap,
|
||||
hxTarget,
|
||||
"change",
|
||||
hxBeforeRequest,
|
||||
hxAfterRequest, ListItemStation(dataStation, selectedIdStation))
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ListItemStation(
|
||||
dataStation []models.TmpSampleStation,
|
||||
selectedIdStation int) {
|
||||
for _, v := range dataStation {
|
||||
if v.T_SampleStationID == selectedIdStation {
|
||||
<option value={ strconv.Itoa(v.T_SampleStationID) } selected="selected">{ v.T_SampleStationName }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.T_SampleStationID) }>{ v.T_SampleStationName }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
templ ShowMdBahanScreen(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,189 +1,189 @@
|
||||
package dev_mdbahanview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/component/customdropdown"
|
||||
|
||||
templ BahanForm(data models.BahanFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormBahan(inputId string,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
inputStation models.CustomDropdownV2Prm,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{Name: "bahanid", ID: "bahanID", Type: "hidden", Value: inputId})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputCode)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputName)
|
||||
@customdropdown.CustomDropdownForm(inputStation)
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormBahan(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormBahan(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId string,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{Name: "bahanid", ID: "bahanID", Type: "hidden", Value: inputId})
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormBahanDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
package dev_mdbahanview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/component/customdropdown"
|
||||
|
||||
templ BahanForm(data models.BahanFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormBahan(inputId string,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
inputStation models.CustomDropdownV2Prm,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{Name: "bahanid", ID: "bahanID", Type: "hidden", Value: inputId})
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputCode)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputName)
|
||||
@customdropdown.CustomDropdownForm(inputStation)
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormBahan(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormBahan(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId string,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{Name: "bahanid", ID: "bahanID", Type: "hidden", Value: inputId})
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormBahanDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,130 +1,130 @@
|
||||
package dev_mdbahanview
|
||||
|
||||
import "cpone/component/table"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ TableBahan(data []models.Bahan,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "NAMA BAHAN", "SAMPLE STATION", "AKSI"},
|
||||
[]string{"20%", "30%", "30%", "20%"},
|
||||
RowBahan(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowBahan(data []models.Bahan,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="4" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.T_BahanCode }</td>
|
||||
<td>{ v.T_BahanName }</td>
|
||||
<td>{ v.T_SampleStationName }</td>
|
||||
<td>
|
||||
@TableAction(v.T_BahanID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactbhn col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class=" btnactbhn col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactbhn');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactbhn');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
package dev_mdbahanview
|
||||
|
||||
import "cpone/component/table"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ TableBahan(data []models.Bahan,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "NAMA BAHAN", "SAMPLE STATION", "AKSI"},
|
||||
[]string{"20%", "30%", "30%", "20%"},
|
||||
RowBahan(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowBahan(data []models.Bahan,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="4" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.T_BahanCode }</td>
|
||||
<td>{ v.T_BahanName }</td>
|
||||
<td>{ v.T_SampleStationName }</td>
|
||||
<td>
|
||||
@TableAction(v.T_BahanID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactbhn col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class=" btnactbhn col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactbhn');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactbhn');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
@@ -1,255 +1,255 @@
|
||||
package dev_mdgroupresultview
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
"strconv"
|
||||
)
|
||||
|
||||
templ MdGroupResultScreen(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterComponent templ.Component,
|
||||
paginationComponent templ.Component,
|
||||
modalAddForm templ.Component,
|
||||
modalEditForm templ.Component,
|
||||
modalDeleteForm templ.Component) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filterComponent
|
||||
<div id="loading-parent" class=" rounded">
|
||||
@tablecontent
|
||||
@paginationComponent
|
||||
@modalAddForm
|
||||
@modalEditForm
|
||||
@modalDeleteForm
|
||||
<div id="loading-child" class=" rounded bg-transparent">
|
||||
// <div class="spinner spinner-lg spinner-primary"></div>
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
// for item dropdown
|
||||
templ ItemDropdown(dataDropdown []models.GroupResultResumeMcu, selectedId int) {
|
||||
if len(dataDropdown) == 0 {
|
||||
<option value="0" disabled selected>Tidak Ada Data</option>
|
||||
} else {
|
||||
for _, v := range dataDropdown {
|
||||
if (selectedId == v.ID) {
|
||||
<option value={ strconv.Itoa(v.ID) } selected>{ v.Text }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.ID) }>{ v.Text }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// for empty div
|
||||
templ EmptyDiv1() {
|
||||
<div></div>
|
||||
}
|
||||
|
||||
templ CssMdGroupResult() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.dropdown-menu{
|
||||
transform: translate3d(0px, 0px, 0px)!important;
|
||||
}
|
||||
|
||||
.filter-option-inner-inner {
|
||||
margin-top: 1.2vh;
|
||||
color: var(--text-disabled);
|
||||
}
|
||||
|
||||
.bootstrap-select > .dropdown-toggle.bs-placeholder.btn {
|
||||
color: var(--text-disabled);
|
||||
}
|
||||
|
||||
.bootstrap-select.btn-group .dropdown-menu {
|
||||
min-width: 100%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
position: sticky;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMdGroupResult() {
|
||||
<script>
|
||||
function onLoadingStart() {
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.add("overlay");
|
||||
// loadingParent.classList.add("overlay-block");
|
||||
// loadingChild.classList.add("overlay-layer");
|
||||
// loadingSpinner.classList.remove("d-none");
|
||||
|
||||
// Additional logic when loading starts
|
||||
}
|
||||
|
||||
function onLoadingEnd() {
|
||||
console.log('Loading ended');
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.remove("overlay");
|
||||
// loadingParent.classList.remove("overlay-block");
|
||||
// loadingChild.classList.remove("overlay-layer");
|
||||
// loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
if (indicator) {
|
||||
onLoadingStart();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
if (indicator) {
|
||||
onLoadingEnd();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContentMdGroupResult() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContentMdGroupResult() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowMdGroupResultScreen(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package dev_mdgroupresultview
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
"strconv"
|
||||
)
|
||||
|
||||
templ MdGroupResultScreen(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterComponent templ.Component,
|
||||
paginationComponent templ.Component,
|
||||
modalAddForm templ.Component,
|
||||
modalEditForm templ.Component,
|
||||
modalDeleteForm templ.Component) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filterComponent
|
||||
<div id="loading-parent" class=" rounded">
|
||||
@tablecontent
|
||||
@paginationComponent
|
||||
@modalAddForm
|
||||
@modalEditForm
|
||||
@modalDeleteForm
|
||||
<div id="loading-child" class=" rounded bg-transparent">
|
||||
// <div class="spinner spinner-lg spinner-primary"></div>
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
// for item dropdown
|
||||
templ ItemDropdown(dataDropdown []models.GroupResultResumeMcu, selectedId int) {
|
||||
if len(dataDropdown) == 0 {
|
||||
<option value="0" disabled selected>Tidak Ada Data</option>
|
||||
} else {
|
||||
for _, v := range dataDropdown {
|
||||
if (selectedId == v.ID) {
|
||||
<option value={ strconv.Itoa(v.ID) } selected>{ v.Text }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.ID) }>{ v.Text }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// for empty div
|
||||
templ EmptyDiv1() {
|
||||
<div></div>
|
||||
}
|
||||
|
||||
templ CssMdGroupResult() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.dropdown-menu{
|
||||
transform: translate3d(0px, 0px, 0px)!important;
|
||||
}
|
||||
|
||||
.filter-option-inner-inner {
|
||||
margin-top: 1.2vh;
|
||||
color: var(--text-disabled);
|
||||
}
|
||||
|
||||
.bootstrap-select > .dropdown-toggle.bs-placeholder.btn {
|
||||
color: var(--text-disabled);
|
||||
}
|
||||
|
||||
.bootstrap-select.btn-group .dropdown-menu {
|
||||
min-width: 100%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
position: sticky;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMdGroupResult() {
|
||||
<script>
|
||||
function onLoadingStart() {
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.add("overlay");
|
||||
// loadingParent.classList.add("overlay-block");
|
||||
// loadingChild.classList.add("overlay-layer");
|
||||
// loadingSpinner.classList.remove("d-none");
|
||||
|
||||
// Additional logic when loading starts
|
||||
}
|
||||
|
||||
function onLoadingEnd() {
|
||||
console.log('Loading ended');
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.remove("overlay");
|
||||
// loadingParent.classList.remove("overlay-block");
|
||||
// loadingChild.classList.remove("overlay-layer");
|
||||
// loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
if (indicator) {
|
||||
onLoadingStart();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
if (indicator) {
|
||||
onLoadingEnd();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContentMdGroupResult() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContentMdGroupResult() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowMdGroupResultScreen(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,205 +1,205 @@
|
||||
package dev_mdgroupresultview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/component/customcheckbox"
|
||||
import "cpone/component/customdropdown"
|
||||
|
||||
templ GroupResultForm(data models.GroupResultFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormGroupResult(inputId models.CustomTextFieldv2Prm,
|
||||
inputGrName models.CustomTextFieldv2Prm,
|
||||
checkboxGrFlagPerTest models.CustomCheckboxv1Prm,
|
||||
checkboxGrFlagNonLab models.CustomCheckboxv1Prm,
|
||||
dropdownGrResumeMcu models.CustomDropdownv1Prm,
|
||||
listItem templ.Component,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputGrName)
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
checkboxGrFlagPerTest)
|
||||
<div class="mt-5"></div>
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
checkboxGrFlagNonLab)
|
||||
<div class="mt-5"></div>
|
||||
@customdropdown.MainCustomDropdownInput(
|
||||
dropdownGrResumeMcu,
|
||||
listItem)
|
||||
</div>
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script JsHideModalGroupResult(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JsShowModalGroupResult(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormGroupResult(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModalGroupResult(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormGroupResult(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModalGroupResult(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBodyGroupResult(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormGroupResultDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModalGroupResult(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
package dev_mdgroupresultview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/component/customcheckbox"
|
||||
import "cpone/component/customdropdown"
|
||||
|
||||
templ GroupResultForm(data models.GroupResultFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormGroupResult(inputId models.CustomTextFieldv2Prm,
|
||||
inputGrName models.CustomTextFieldv2Prm,
|
||||
checkboxGrFlagPerTest models.CustomCheckboxv1Prm,
|
||||
checkboxGrFlagNonLab models.CustomCheckboxv1Prm,
|
||||
dropdownGrResumeMcu models.CustomDropdownv1Prm,
|
||||
listItem templ.Component,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputGrName)
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
checkboxGrFlagPerTest)
|
||||
<div class="mt-5"></div>
|
||||
@customcheckbox.MainCustomCheckboxInput(
|
||||
checkboxGrFlagNonLab)
|
||||
<div class="mt-5"></div>
|
||||
@customdropdown.MainCustomDropdownInput(
|
||||
dropdownGrResumeMcu,
|
||||
listItem)
|
||||
</div>
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script JsHideModalGroupResult(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JsShowModalGroupResult(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormGroupResult(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModalGroupResult(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormGroupResult(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModalGroupResult(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBodyGroupResult(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormGroupResultDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModalGroupResult(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,131 +1,131 @@
|
||||
package dev_mdgroupresultview
|
||||
|
||||
import "cpone/component/table"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ TableGroupResult(data []models.GroupResult,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"GROUP RESULT NAME", "RESULT FLAG PER TEST", "RESULT FLAG NON LAB", "RESULT RESUME MCU", "AKSI"},
|
||||
[]string{"20%", "20%", "20%", "20%", "20%"},
|
||||
RowGroupResult(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowGroupResult(data []models.GroupResult,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.Group_ResultName }</td>
|
||||
<td>{ v.Group_ResultFlagPerTest }</td>
|
||||
<td>{ v.Group_ResultFlagNonLab }</td>
|
||||
<td>{ v.Group_ResultResumeMcu }</td>
|
||||
<td>
|
||||
@TableAction(v.Group_ResultID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactiongr col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class=" btnactiongr col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactiongr');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactiongr');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
package dev_mdgroupresultview
|
||||
|
||||
import "cpone/component/table"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ TableGroupResult(data []models.GroupResult,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"GROUP RESULT NAME", "RESULT FLAG PER TEST", "RESULT FLAG NON LAB", "RESULT RESUME MCU", "AKSI"},
|
||||
[]string{"20%", "20%", "20%", "20%", "20%"},
|
||||
RowGroupResult(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowGroupResult(data []models.GroupResult,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.Group_ResultName }</td>
|
||||
<td>{ v.Group_ResultFlagPerTest }</td>
|
||||
<td>{ v.Group_ResultFlagNonLab }</td>
|
||||
<td>{ v.Group_ResultResumeMcu }</td>
|
||||
<td>
|
||||
@TableAction(v.Group_ResultID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactiongr col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class=" btnactiongr col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactiongr');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactiongr');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
@@ -1,212 +1,212 @@
|
||||
package dev_mdnatunitview
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ MdNatUnitScreen(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterComponent templ.Component,
|
||||
paginationComponent templ.Component,
|
||||
modalAddForm templ.Component,
|
||||
modalEditForm templ.Component,
|
||||
modalDeleteForm templ.Component) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filterComponent
|
||||
<div id="loading-parent" class=" rounded">
|
||||
@tablecontent
|
||||
@paginationComponent
|
||||
@modalAddForm
|
||||
@modalEditForm
|
||||
@modalDeleteForm
|
||||
<div id="loading-child" class=" rounded bg-transparent">
|
||||
// <div class="spinner spinner-lg spinner-primary"></div>
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMdNatUnit() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMdNatUnit() {
|
||||
<script>
|
||||
function onLoadingStart() {
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.add("overlay");
|
||||
// loadingParent.classList.add("overlay-block");
|
||||
// loadingChild.classList.add("overlay-layer");
|
||||
// loadingSpinner.classList.remove("d-none");
|
||||
|
||||
// Additional logic when loading starts
|
||||
}
|
||||
|
||||
function onLoadingEnd() {
|
||||
console.log('Loading ended');
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.remove("overlay");
|
||||
// loadingParent.classList.remove("overlay-block");
|
||||
// loadingChild.classList.remove("overlay-layer");
|
||||
// loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
if (indicator) {
|
||||
onLoadingStart();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
if (indicator) {
|
||||
onLoadingEnd();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowMdNatUnitScreen(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package dev_mdnatunitview
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ MdNatUnitScreen(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterComponent templ.Component,
|
||||
paginationComponent templ.Component,
|
||||
modalAddForm templ.Component,
|
||||
modalEditForm templ.Component,
|
||||
modalDeleteForm templ.Component) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filterComponent
|
||||
<div id="loading-parent" class=" rounded">
|
||||
@tablecontent
|
||||
@paginationComponent
|
||||
@modalAddForm
|
||||
@modalEditForm
|
||||
@modalDeleteForm
|
||||
<div id="loading-child" class=" rounded bg-transparent">
|
||||
// <div class="spinner spinner-lg spinner-primary"></div>
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMdNatUnit() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMdNatUnit() {
|
||||
<script>
|
||||
function onLoadingStart() {
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.add("overlay");
|
||||
// loadingParent.classList.add("overlay-block");
|
||||
// loadingChild.classList.add("overlay-layer");
|
||||
// loadingSpinner.classList.remove("d-none");
|
||||
|
||||
// Additional logic when loading starts
|
||||
}
|
||||
|
||||
function onLoadingEnd() {
|
||||
console.log('Loading ended');
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.remove("overlay");
|
||||
// loadingParent.classList.remove("overlay-block");
|
||||
// loadingChild.classList.remove("overlay-layer");
|
||||
// loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
if (indicator) {
|
||||
onLoadingStart();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
if (indicator) {
|
||||
onLoadingEnd();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowMdNatUnitScreen(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,187 +1,187 @@
|
||||
package dev_mdnatunitview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
|
||||
templ NatUnitForm(data models.NatUnitFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormNatUnit(inputId models.CustomTextFieldv2Prm,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputCode)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputName)
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormNatUnit(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormNatUnit(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormUserGroupDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
package dev_mdnatunitview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
|
||||
templ NatUnitForm(data models.NatUnitFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormNatUnit(inputId models.CustomTextFieldv2Prm,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputCode)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputName)
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormNatUnit(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormNatUnit(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormUserGroupDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,130 +1,130 @@
|
||||
package dev_mdnatunitview
|
||||
|
||||
import (
|
||||
"cpone/component/table"
|
||||
"cpone/models"
|
||||
"strconv"
|
||||
)
|
||||
|
||||
templ TableNatUnit(data []models.NatUnit,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "UNIT", "AKSI"},
|
||||
[]string{"40%", "40%", "20%"},
|
||||
RowNatUnit(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowNatUnit(data []models.NatUnit,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.Nat_UnitCode }</td>
|
||||
<td>{ v.Nat_UnitName }</td>
|
||||
<td>
|
||||
@TableAction(v.Nat_UnitID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactionug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class=" btnactionug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionug');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
// console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionug');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
// console.log(id)
|
||||
}
|
||||
package dev_mdnatunitview
|
||||
|
||||
import (
|
||||
"cpone/component/table"
|
||||
"cpone/models"
|
||||
"strconv"
|
||||
)
|
||||
|
||||
templ TableNatUnit(data []models.NatUnit,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "UNIT", "AKSI"},
|
||||
[]string{"40%", "40%", "20%"},
|
||||
RowNatUnit(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowNatUnit(data []models.NatUnit,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.Nat_UnitCode }</td>
|
||||
<td>{ v.Nat_UnitName }</td>
|
||||
<td>
|
||||
@TableAction(v.Nat_UnitID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactionug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class=" btnactionug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionug');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
// console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionug');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
// console.log(id)
|
||||
}
|
||||
|
||||
@@ -1,185 +1,185 @@
|
||||
package dev_mdsamplestationview
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ ContentMDSampleStation(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filtercomponent templ.Component,
|
||||
paginationtable templ.Component,
|
||||
modalAddForm templ.Component,
|
||||
modalEditForm templ.Component,
|
||||
modalDeleteForm templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filtercomponent
|
||||
<div id="loading-parent" class="rounded">
|
||||
@tablecontent
|
||||
@paginationtable
|
||||
@modalAddForm
|
||||
@modalEditForm
|
||||
@modalDeleteForm
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSMDSampleStation() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JSMDSampleStation() {
|
||||
<script>
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
if (indicator) {
|
||||
console.log('loading start');
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
if (indicator) {
|
||||
console.log('loading end');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowMDSampleStation(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
package dev_mdsamplestationview
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ ContentMDSampleStation(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filtercomponent templ.Component,
|
||||
paginationtable templ.Component,
|
||||
modalAddForm templ.Component,
|
||||
modalEditForm templ.Component,
|
||||
modalDeleteForm templ.Component,
|
||||
) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-item-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filtercomponent
|
||||
<div id="loading-parent" class="rounded">
|
||||
@tablecontent
|
||||
@paginationtable
|
||||
@modalAddForm
|
||||
@modalEditForm
|
||||
@modalDeleteForm
|
||||
<div id="loading-child" class="rounded bg-transparent">
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CSSMDSampleStation() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
#div-chart {
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JSMDSampleStation() {
|
||||
<script>
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
if (indicator) {
|
||||
console.log('loading start');
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
if (indicator) {
|
||||
console.log('loading end');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowMDSampleStation(
|
||||
title string,
|
||||
cmp templ.Component,
|
||||
css templ.Component,
|
||||
js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
@@ -1,200 +1,200 @@
|
||||
package dev_mdsamplestationview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/component/customdropdown"
|
||||
import "strconv"
|
||||
|
||||
templ MDSampleStationForm(data models.MDSampleStationForm) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonClose,
|
||||
)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnActSaveData = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
}
|
||||
for (let i = 0; i < btnActSaveData.length; i++) {
|
||||
btnActSaveData[i].setAttribute('disabled', 'true');
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnActSaveData = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].removeAttribute('disabled');
|
||||
}
|
||||
for (let i = 0; i < btnActSaveData.length; i++) {
|
||||
btnActSaveData[i].removeAttribute('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormMDSampleStation(
|
||||
componentID string,
|
||||
inputID models.CustomTextFieldv2Prm,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
inputGroup models.CustomDropdownv1Prm,
|
||||
listGroup templ.Component,
|
||||
hxOnLoad templ.ComponentScript,
|
||||
) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(inputID)
|
||||
@customtextfield.CustomTextFieldv2(inputCode)
|
||||
@customtextfield.CustomTextFieldv2(inputName)
|
||||
@customdropdown.MainCustomDropdownInput(inputGroup, listGroup)
|
||||
</div>
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
})
|
||||
</script>
|
||||
}
|
||||
|
||||
templ ItemGroupDropdown(itemGroup []models.MDSampleStationGroup, selectedId int) {
|
||||
if len(itemGroup) == 0 {
|
||||
<option value="0" disabled selected>Tidak Ada Data</option>
|
||||
} else {
|
||||
for _, v := range itemGroup {
|
||||
if (selectedId == v.ID) {
|
||||
<option value={ strconv.Itoa(v.ID) } selected>{ v.Group }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.ID) }>{ v.Group }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
script JSHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JSShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnActSaveData = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].removeAttribute('disabled');
|
||||
}
|
||||
for (let i = 0; i < btnActSaveData.length; i++) {
|
||||
btnActSaveData[i].removeAttribute('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormMDSampleStation(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JSHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormMDSampleStation(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JSHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(
|
||||
inputID models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
dataHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript,
|
||||
) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range dataHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputID)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormMDSampleStationDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JSHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
package dev_mdsamplestationview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
import "cpone/component/customdropdown"
|
||||
import "strconv"
|
||||
|
||||
templ MDSampleStationForm(data models.MDSampleStationForm) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonClose,
|
||||
)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnActSaveData = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
}
|
||||
for (let i = 0; i < btnActSaveData.length; i++) {
|
||||
btnActSaveData[i].setAttribute('disabled', 'true');
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnActSaveData = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].removeAttribute('disabled');
|
||||
}
|
||||
for (let i = 0; i < btnActSaveData.length; i++) {
|
||||
btnActSaveData[i].removeAttribute('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormMDSampleStation(
|
||||
componentID string,
|
||||
inputID models.CustomTextFieldv2Prm,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
inputGroup models.CustomDropdownv1Prm,
|
||||
listGroup templ.Component,
|
||||
hxOnLoad templ.ComponentScript,
|
||||
) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(inputID)
|
||||
@customtextfield.CustomTextFieldv2(inputCode)
|
||||
@customtextfield.CustomTextFieldv2(inputName)
|
||||
@customdropdown.MainCustomDropdownInput(inputGroup, listGroup)
|
||||
</div>
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
})
|
||||
</script>
|
||||
}
|
||||
|
||||
templ ItemGroupDropdown(itemGroup []models.MDSampleStationGroup, selectedId int) {
|
||||
if len(itemGroup) == 0 {
|
||||
<option value="0" disabled selected>Tidak Ada Data</option>
|
||||
} else {
|
||||
for _, v := range itemGroup {
|
||||
if (selectedId == v.ID) {
|
||||
<option value={ strconv.Itoa(v.ID) } selected>{ v.Group }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.ID) }>{ v.Group }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
script JSHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JSShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnActSaveData = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].removeAttribute('disabled');
|
||||
}
|
||||
for (let i = 0; i < btnActSaveData.length; i++) {
|
||||
btnActSaveData[i].removeAttribute('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormMDSampleStation(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JSHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormMDSampleStation(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JSHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(
|
||||
inputID models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
dataHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript,
|
||||
) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range dataHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputID)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormMDSampleStationDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JSHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
@@ -1,129 +1,129 @@
|
||||
package dev_mdsamplestationview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/table"
|
||||
import "strconv"
|
||||
|
||||
templ TableSampleStation(data []models.MDSampleStation,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "NAMA STATION", "GROUP", "AKSI"},
|
||||
[]string{"20%", "30%", "30%", "20%"},
|
||||
ItemRow(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemRow(data []models.MDSampleStation,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="4" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.T_SampleStationCode }</td>
|
||||
<td>{ v.T_SampleStationName }</td>
|
||||
<td>{ v.T_SampleStationIsNonLab }</td>
|
||||
<td>
|
||||
@ItemAction(v.T_SampleStationID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ ItemAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactionmdss col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit +"?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class="btnactionmdss col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete +"?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionmdss');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionmdss');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
package dev_mdsamplestationview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/table"
|
||||
import "strconv"
|
||||
|
||||
templ TableSampleStation(data []models.MDSampleStation,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "NAMA STATION", "GROUP", "AKSI"},
|
||||
[]string{"20%", "30%", "30%", "20%"},
|
||||
ItemRow(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ItemRow(data []models.MDSampleStation,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="4" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.T_SampleStationCode }</td>
|
||||
<td>{ v.T_SampleStationName }</td>
|
||||
<td>{ v.T_SampleStationIsNonLab }</td>
|
||||
<td>
|
||||
@ItemAction(v.T_SampleStationID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ ItemAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactionmdss col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit +"?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class="btnactionmdss col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete +"?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionmdss');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionmdss');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
@@ -1,213 +1,213 @@
|
||||
package dev_mdusergroupview
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ MdUserGroupScreen(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterComponent templ.Component,
|
||||
paginationComponent templ.Component,
|
||||
modalAddForm templ.Component,
|
||||
modalEditForm templ.Component,
|
||||
modalDeleteForm templ.Component) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filterComponent
|
||||
<div id="loading-parent" class=" rounded">
|
||||
@tablecontent
|
||||
@paginationComponent
|
||||
@modalAddForm
|
||||
@modalEditForm
|
||||
@modalDeleteForm
|
||||
<div id="loading-child" class=" rounded bg-transparent">
|
||||
// <div class="spinner spinner-lg spinner-primary"></div>
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMdUserGroup() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMdUserGroup() {
|
||||
<script>
|
||||
function onLoadingStart() {
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.add("overlay");
|
||||
// loadingParent.classList.add("overlay-block");
|
||||
// loadingChild.classList.add("overlay-layer");
|
||||
// loadingSpinner.classList.remove("d-none");
|
||||
|
||||
// Additional logic when loading starts
|
||||
}
|
||||
|
||||
function onLoadingEnd() {
|
||||
console.log('Loading ended');
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.remove("overlay");
|
||||
// loadingParent.classList.remove("overlay-block");
|
||||
// loadingChild.classList.remove("overlay-layer");
|
||||
// loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
if (indicator) {
|
||||
onLoadingStart();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
if (indicator) {
|
||||
onLoadingEnd();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowMdUserGroupScreen(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package dev_mdusergroupview
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
"cpone/component/customtextfield"
|
||||
"cpone/models"
|
||||
)
|
||||
|
||||
templ MdUserGroupScreen(
|
||||
tableID string,
|
||||
paginationID string,
|
||||
searchID string,
|
||||
dialogAddID string,
|
||||
dialogAddBodyID string,
|
||||
dialogEditID string,
|
||||
dialogEditBodyID string,
|
||||
dialogDeleteID string,
|
||||
dialogDeleteBodyID string,
|
||||
breadcrumb templ.Component,
|
||||
tablecontent templ.Component,
|
||||
filterComponent templ.Component,
|
||||
paginationComponent templ.Component,
|
||||
modalAddForm templ.Component,
|
||||
modalEditForm templ.Component,
|
||||
modalDeleteForm templ.Component) {
|
||||
<div class="container-fluid">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "tableID",
|
||||
Name: "tableID",
|
||||
Type: "hidden",
|
||||
Value: tableID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "paginationID",
|
||||
Name: "paginationID",
|
||||
Type: "hidden",
|
||||
Value: paginationID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "searchID",
|
||||
Name: "searchID",
|
||||
Type: "hidden",
|
||||
Value: searchID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddID",
|
||||
Name: "dialogAddID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogAddBodyID",
|
||||
Name: "dialogAddBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogAddBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditID",
|
||||
Name: "dialogEditID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogEditBodyID",
|
||||
Name: "dialogEditBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogEditBodyID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteID",
|
||||
Name: "dialogDeleteID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteID})
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "dialogDeleteBodyID",
|
||||
Name: "dialogDeleteBodyID",
|
||||
Type: "hidden",
|
||||
Value: dialogDeleteBodyID})
|
||||
<div class="row align-items-center mb-10">
|
||||
<div class="col-md-10 col-sm-12 p-0 ">
|
||||
@breadcrumb
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
|
||||
// <div class="d-block align-items-center">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary btn-block"
|
||||
data-toggle="modal"
|
||||
data-target={ "#" + dialogAddID }
|
||||
>Add New</button>
|
||||
</div>
|
||||
</div>
|
||||
@filterComponent
|
||||
<div id="loading-parent" class=" rounded">
|
||||
@tablecontent
|
||||
@paginationComponent
|
||||
@modalAddForm
|
||||
@modalEditForm
|
||||
@modalDeleteForm
|
||||
<div id="loading-child" class=" rounded bg-transparent">
|
||||
// <div class="spinner spinner-lg spinner-primary"></div>
|
||||
<div id="loading-spinner" class="spinner-border text-primary d-none" style="width: 3rem; height: 3rem;" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loadingcontent"></div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssMdUserGroup() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
#div-chart {
|
||||
/* overflow-x: scroll; */
|
||||
margin: 40px 10vw 40px 10vw;
|
||||
}
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
#title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsMdUserGroup() {
|
||||
<script>
|
||||
function onLoadingStart() {
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.add("overlay");
|
||||
// loadingParent.classList.add("overlay-block");
|
||||
// loadingChild.classList.add("overlay-layer");
|
||||
// loadingSpinner.classList.remove("d-none");
|
||||
|
||||
// Additional logic when loading starts
|
||||
}
|
||||
|
||||
function onLoadingEnd() {
|
||||
console.log('Loading ended');
|
||||
// const loadingParent = document.getElementById("loading-parent");
|
||||
// const loadingChild = document.getElementById("loading-child");
|
||||
// const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
// loadingParent.classList.remove("overlay");
|
||||
// loadingParent.classList.remove("overlay-block");
|
||||
// loadingChild.classList.remove("overlay-layer");
|
||||
// loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
if (indicator) {
|
||||
onLoadingStart();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
var indicator = document.querySelector('#loadingcontent');
|
||||
if (indicator) {
|
||||
onLoadingEnd();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.add("overlay");
|
||||
loadingParent.classList.add("overlay-block");
|
||||
loadingChild.classList.add("overlay-layer");
|
||||
loadingSpinner.classList.remove("d-none");
|
||||
}
|
||||
|
||||
script AfterRequestContent() {
|
||||
const loadingParent = document.getElementById("loading-parent");
|
||||
const loadingChild = document.getElementById("loading-child");
|
||||
const loadingSpinner = document.getElementById("loading-spinner");
|
||||
|
||||
loadingParent.classList.remove("overlay");
|
||||
loadingParent.classList.remove("overlay-block");
|
||||
loadingChild.classList.remove("overlay-layer");
|
||||
loadingSpinner.classList.add("d-none");
|
||||
}
|
||||
|
||||
templ ShowMdUserGroupScreen(title string, cmp templ.Component, css templ.Component, js templ.Component,
|
||||
navbarmenu templ.Component,
|
||||
navbaruser templ.Component,
|
||||
userprofile templ.Component) {
|
||||
@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,187 +1,187 @@
|
||||
package dev_mdusergroupview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
|
||||
templ UserGroupForm(data models.UserGroupFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormUserGroup(inputId models.CustomTextFieldv2Prm,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputCode)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputName)
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormUserGroup(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormUserGroup(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormUserGroupDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
package dev_mdusergroupview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customtextfield"
|
||||
|
||||
templ UserGroupForm(data models.UserGroupFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.Modal(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormUserGroup(inputId models.CustomTextFieldv2Prm,
|
||||
inputCode models.CustomTextFieldv2Prm,
|
||||
inputName models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputId)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputCode)
|
||||
@customtextfield.CustomTextFieldv2(
|
||||
inputName)
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormUserGroup(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormUserGroup(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId models.CustomTextFieldv2Prm,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(inputId)
|
||||
</div>
|
||||
}
|
||||
|
||||
templ ActionFormUserGroupDelete(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Yakin
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,129 +1,129 @@
|
||||
package dev_mdusergroupview
|
||||
|
||||
import "cpone/component/table"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ TableUserGroup(data []models.UserGroupV1,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "USERGROUP", "AKSI"},
|
||||
[]string{"40%", "40%", "20%"},
|
||||
RowUserGroup(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowUserGroup(data []models.UserGroupV1,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.M_UserGroupCode }</td>
|
||||
<td>{ v.M_UserGroupName }</td>
|
||||
<td>
|
||||
@TableAction(v.M_UserGroupID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactionug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class=" btnactionug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionug');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionug');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
package dev_mdusergroupview
|
||||
|
||||
import "cpone/component/table"
|
||||
import "cpone/models"
|
||||
import "strconv"
|
||||
|
||||
templ TableUserGroup(data []models.UserGroupV1,
|
||||
tableID string,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
<div id={ tableID } hx-swap-oob="true">
|
||||
@tablecomponent.TableV3([]string{"KODE", "USERGROUP", "AKSI"},
|
||||
[]string{"40%", "40%", "20%"},
|
||||
RowUserGroup(data,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
))
|
||||
</div>
|
||||
}
|
||||
|
||||
templ RowUserGroup(data []models.UserGroupV1,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
<tr>
|
||||
<td>{ v.M_UserGroupCode }</td>
|
||||
<td>{ v.M_UserGroupName }</td>
|
||||
<td>
|
||||
@TableAction(v.M_UserGroupID,
|
||||
hxGetEdit,
|
||||
hxTargetEdit,
|
||||
hxSwapEdit,
|
||||
hxIncludeEdit,
|
||||
hxGetDelete,
|
||||
hxTargetDelete,
|
||||
hxSwapDelete,
|
||||
hxIncludeDelete,
|
||||
)
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}
|
||||
|
||||
templ TableAction(
|
||||
id int,
|
||||
hxGetEdit string,
|
||||
hxTargetEdit string,
|
||||
hxSwapEdit string,
|
||||
hxIncludeEdit string,
|
||||
hxGetDelete string,
|
||||
hxTargetDelete string,
|
||||
hxSwapDelete string,
|
||||
hxIncludeDelete string,
|
||||
|
||||
) {
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<a
|
||||
type="button"
|
||||
class="btnactionug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2 btn-sm"
|
||||
hx-get={ hxGetEdit + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetEdit }
|
||||
hx-swap={ hxSwapEdit }
|
||||
hx-include={ hxIncludeEdit }
|
||||
hx-indicator={ "#spnredt" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnredt" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Edit
|
||||
</a>
|
||||
<a
|
||||
type="button"
|
||||
class=" btnactionug col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2 btn-sm"
|
||||
hx-get={ hxGetDelete + "?id=" + strconv.Itoa(id) }
|
||||
hx-target={ hxTargetDelete }
|
||||
hx-swap={ hxSwapDelete }
|
||||
hx-include={ hxIncludeDelete }
|
||||
hx-indicator={ "#spnrdel" + strconv.Itoa(id) }
|
||||
hx-on::before-request={ HandleBeforeRequestRow(strconv.Itoa(id)) }
|
||||
hx-on::after-request={ HandleAfterRequestRow(strconv.Itoa(id)) }
|
||||
>
|
||||
<span id={ "spnrdel" + strconv.Itoa(id) } class="htmx-indicator spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
Hapus
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleBeforeRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionug');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.add('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
script HandleAfterRequestRow(id string) {
|
||||
var cusid_ele = document.getElementsByClassName('btnactionug');
|
||||
for (var i = 0; i < cusid_ele.length; ++i) {
|
||||
var item = cusid_ele[i];
|
||||
item.classList.remove('disabled');
|
||||
}
|
||||
console.log(id)
|
||||
}
|
||||
|
||||
@@ -1,59 +1,59 @@
|
||||
package piechart
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
chart "cpone/component/chart"
|
||||
)
|
||||
|
||||
templ MainPieChart(idDiv string, udata string) {
|
||||
<!-- title -->
|
||||
<div class="row justify-content-center mb-3 mt-3">
|
||||
<div class="col-lg-8 col-xxl-8 col-md-10 text-center">
|
||||
<p class="title">Data Kepesertaan MCU</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- title -->
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8 col-xxl-8 col-md-10 text-center" style="margin-bottom: 40px;">
|
||||
@chart.ShowChart(idDiv, udata)
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssPieChart() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsPieChart() {
|
||||
// echart
|
||||
<script src="assets/js/echarts-js/echart.min.js"></script>
|
||||
}
|
||||
|
||||
templ ShowPieChart(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package piechart
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
chart "cpone/component/chart"
|
||||
)
|
||||
|
||||
templ MainPieChart(idDiv string, udata string) {
|
||||
<!-- title -->
|
||||
<div class="row justify-content-center mb-3 mt-3">
|
||||
<div class="col-lg-8 col-xxl-8 col-md-10 text-center">
|
||||
<p class="title">Data Kepesertaan MCU</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- title -->
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8 col-xxl-8 col-md-10 text-center" style="margin-bottom: 40px;">
|
||||
@chart.ShowChart(idDiv, udata)
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssPieChart() {
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/poppins.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/publicsans.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="assets/css/googlefont/roboto.css"
|
||||
/>
|
||||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
/* padding-right: 100px;
|
||||
padding-left: 100px; */
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size:20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
templ JsPieChart() {
|
||||
// echart
|
||||
<script src="assets/js/echarts-js/echart.min.js"></script>
|
||||
}
|
||||
|
||||
templ ShowPieChart(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,52 +1,52 @@
|
||||
package user
|
||||
|
||||
import (
|
||||
services "cpone/services/dev"
|
||||
"cpone/layout"
|
||||
"fmt"
|
||||
)
|
||||
|
||||
templ Details(tz string, user services.User) {
|
||||
<h1 class="text-3xl text-center font-bold capitalize">
|
||||
{ fmt.Sprintf("User details %s", user.Username) }
|
||||
</h1>
|
||||
<section class="card w-96 bg-base-300 shadow-xl mx-auto mt-12">
|
||||
<div class="card-body flex flex-col gap-6">
|
||||
<h1 class="card-title capitalize text-secondary text-2xl italic">
|
||||
{ user.Username }
|
||||
</h1>
|
||||
<ul class="flex flex-col gap-2 list-disc marker:text-secondary text-sm text-secondary font-semibold">
|
||||
<li>
|
||||
Email:
|
||||
<span class="text-neutral-content font-light">
|
||||
{ user.Email }
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
Created At:
|
||||
<span class="text-neutral-content font-light">
|
||||
{ services.ConverDateTime(tz, user.CreatedAt) }
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="divider divider-secondary -m-4"></div>
|
||||
<div class="card-actions justify-end">
|
||||
<a
|
||||
hx-swap="transition:true"
|
||||
class="block w-fit h-fit badge badge-outline hover:scale-[1.03] ease-in duration-300"
|
||||
href="/user"
|
||||
>
|
||||
<p class="m-1">
|
||||
← Back to User List
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
|
||||
templ DetailsIndex(title string, cmp templ.Component) {
|
||||
@layout.Base(title) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package user
|
||||
|
||||
import (
|
||||
services "cpone/services/dev"
|
||||
"cpone/layout"
|
||||
"fmt"
|
||||
)
|
||||
|
||||
templ Details(tz string, user services.User) {
|
||||
<h1 class="text-3xl text-center font-bold capitalize">
|
||||
{ fmt.Sprintf("User details %s", user.Username) }
|
||||
</h1>
|
||||
<section class="card w-96 bg-base-300 shadow-xl mx-auto mt-12">
|
||||
<div class="card-body flex flex-col gap-6">
|
||||
<h1 class="card-title capitalize text-secondary text-2xl italic">
|
||||
{ user.Username }
|
||||
</h1>
|
||||
<ul class="flex flex-col gap-2 list-disc marker:text-secondary text-sm text-secondary font-semibold">
|
||||
<li>
|
||||
Email:
|
||||
<span class="text-neutral-content font-light">
|
||||
{ user.Email }
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
Created At:
|
||||
<span class="text-neutral-content font-light">
|
||||
{ services.ConverDateTime(tz, user.CreatedAt) }
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="divider divider-secondary -m-4"></div>
|
||||
<div class="card-actions justify-end">
|
||||
<a
|
||||
hx-swap="transition:true"
|
||||
class="block w-fit h-fit badge badge-outline hover:scale-[1.03] ease-in duration-300"
|
||||
href="/user"
|
||||
>
|
||||
<p class="m-1">
|
||||
← Back to User List
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
|
||||
templ DetailsIndex(title string, cmp templ.Component) {
|
||||
@layout.Base(title) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,73 +1,73 @@
|
||||
package user
|
||||
|
||||
import (
|
||||
"strconv"
|
||||
|
||||
"cpone/layout"
|
||||
services "cpone/services/dev"
|
||||
"fmt"
|
||||
)
|
||||
|
||||
templ Show(users []services.User) {
|
||||
<h1 class="text-3xl text-center font-bold">
|
||||
Users List
|
||||
</h1>
|
||||
<section class="overflow-auto max-w-2xl max-h-96 mx-auto mt-12 bg-slate-600 rounded-lg shadow-xl">
|
||||
<table class="table table-zebra">
|
||||
<!-- head -->
|
||||
<thead class="bg-slate-700">
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Username</th>
|
||||
<th class="text-center">Email</th>
|
||||
<!-- <th class="text-center">Created At</th> -->
|
||||
</tr>
|
||||
</thead>
|
||||
if len(users) != 0 {
|
||||
<tbody>
|
||||
for _, user := range users {
|
||||
<tr>
|
||||
<th>{ strconv.Itoa(int(user.ID)) }</th>
|
||||
<td>
|
||||
<a
|
||||
hx-swap="transition:true"
|
||||
hx-headers="js:{'X-TimeZone': Intl.DateTimeFormat().resolvedOptions().timeZone}"
|
||||
class="hover:text-sky-500 ease-in duration-300 hover:underline flex gap-2 justify-between"
|
||||
href={ templ.URL(
|
||||
fmt.Sprintf(
|
||||
"/user/details/%d", user.ID,
|
||||
)) }
|
||||
>
|
||||
{ user.Username }
|
||||
<img
|
||||
class="hover:scale-[1.2] ease-in duration-300"
|
||||
src="/img/info_icon.svg"
|
||||
alt="Info icon"
|
||||
/>
|
||||
</a>
|
||||
</td>
|
||||
<td>{ user.Email }</td>
|
||||
<!-- <td class="flex justify-center gap-2">
|
||||
Created At
|
||||
</td> -->
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
} else {
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="4" align="center">
|
||||
There are no users to show yet
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
}
|
||||
</table>
|
||||
</section>
|
||||
}
|
||||
|
||||
templ ShowIndex(title string, cmp templ.Component) {
|
||||
@layout.Base(title) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package user
|
||||
|
||||
import (
|
||||
"strconv"
|
||||
|
||||
"cpone/layout"
|
||||
services "cpone/services/dev"
|
||||
"fmt"
|
||||
)
|
||||
|
||||
templ Show(users []services.User) {
|
||||
<h1 class="text-3xl text-center font-bold">
|
||||
Users List
|
||||
</h1>
|
||||
<section class="overflow-auto max-w-2xl max-h-96 mx-auto mt-12 bg-slate-600 rounded-lg shadow-xl">
|
||||
<table class="table table-zebra">
|
||||
<!-- head -->
|
||||
<thead class="bg-slate-700">
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Username</th>
|
||||
<th class="text-center">Email</th>
|
||||
<!-- <th class="text-center">Created At</th> -->
|
||||
</tr>
|
||||
</thead>
|
||||
if len(users) != 0 {
|
||||
<tbody>
|
||||
for _, user := range users {
|
||||
<tr>
|
||||
<th>{ strconv.Itoa(int(user.ID)) }</th>
|
||||
<td>
|
||||
<a
|
||||
hx-swap="transition:true"
|
||||
hx-headers="js:{'X-TimeZone': Intl.DateTimeFormat().resolvedOptions().timeZone}"
|
||||
class="hover:text-sky-500 ease-in duration-300 hover:underline flex gap-2 justify-between"
|
||||
href={ templ.URL(
|
||||
fmt.Sprintf(
|
||||
"/user/details/%d", user.ID,
|
||||
)) }
|
||||
>
|
||||
{ user.Username }
|
||||
<img
|
||||
class="hover:scale-[1.2] ease-in duration-300"
|
||||
src="/img/info_icon.svg"
|
||||
alt="Info icon"
|
||||
/>
|
||||
</a>
|
||||
</td>
|
||||
<td>{ user.Email }</td>
|
||||
<!-- <td class="flex justify-center gap-2">
|
||||
Created At
|
||||
</td> -->
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
} else {
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="4" align="center">
|
||||
There are no users to show yet
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
}
|
||||
</table>
|
||||
</section>
|
||||
}
|
||||
|
||||
templ ShowIndex(title string, cmp templ.Component) {
|
||||
@layout.Base(title) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,64 +1,64 @@
|
||||
package xsample
|
||||
|
||||
import (
|
||||
"cpone/component/table"
|
||||
)
|
||||
|
||||
templ Coba(title string) {
|
||||
<div>{ title }</div>
|
||||
@tablecomponent.Table([]string{"kode", "user group", "aksi"}, []string{"40%", "40%", "20%"}, tr(), pagination())
|
||||
}
|
||||
|
||||
templ CssCoba() {
|
||||
}
|
||||
|
||||
templ JsCoba() {
|
||||
}
|
||||
|
||||
templ tr() {
|
||||
<tr>
|
||||
<td>001</td>
|
||||
<td>Admin</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<button type="button" class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2">Edit</button>
|
||||
<button type="button" class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2">Hapus</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>002</td>
|
||||
<td>Tes</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<button type="button" class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2">Edit</button>
|
||||
<button type="button" class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2">Hapus</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
|
||||
templ pagination() {
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap">
|
||||
<div class="d-flex flex-wrap py-2 mr-3">
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">23</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light btn-hover-primary active mr-2 my-1">24</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">25</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">26</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">27</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">28</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-next icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-next icon-xs"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
// templ ShowCoba(title string, cmp templ.Component, css templ.Component, js templ.Component, dataMenu []services.MasterMenu, dataUser models.User) {
|
||||
// @layout.CorporateLayout(title, css, js, dataMenu, dataUser) {
|
||||
// @cmp
|
||||
// }
|
||||
// }
|
||||
package xsample
|
||||
|
||||
import (
|
||||
"cpone/component/table"
|
||||
)
|
||||
|
||||
templ Coba(title string) {
|
||||
<div>{ title }</div>
|
||||
@tablecomponent.Table([]string{"kode", "user group", "aksi"}, []string{"40%", "40%", "20%"}, tr(), pagination())
|
||||
}
|
||||
|
||||
templ CssCoba() {
|
||||
}
|
||||
|
||||
templ JsCoba() {
|
||||
}
|
||||
|
||||
templ tr() {
|
||||
<tr>
|
||||
<td>001</td>
|
||||
<td>Admin</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<button type="button" class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2">Edit</button>
|
||||
<button type="button" class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2">Hapus</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>002</td>
|
||||
<td>Tes</td>
|
||||
<td>
|
||||
<div class="row px-5 d-flex justify-content-around">
|
||||
<button type="button" class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2">Edit</button>
|
||||
<button type="button" class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2">Hapus</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
|
||||
templ pagination() {
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap">
|
||||
<div class="d-flex flex-wrap py-2 mr-3">
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-back icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">23</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light btn-hover-primary active mr-2 my-1">24</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">25</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">26</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">27</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">28</a>
|
||||
<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-next icon-xs"></i></a>
|
||||
<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-next icon-xs"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
// templ ShowCoba(title string, cmp templ.Component, css templ.Component, js templ.Component, dataMenu []services.MasterMenu, dataUser models.User) {
|
||||
// @layout.CorporateLayout(title, css, js, dataMenu, dataUser) {
|
||||
// @cmp
|
||||
// }
|
||||
// }
|
||||
|
||||
@@ -1,51 +1,51 @@
|
||||
package xsample
|
||||
|
||||
import "strconv"
|
||||
import (
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Counts(counter int) {
|
||||
<div id="xyzz">counter: { strconv.Itoa(counter) }</div>
|
||||
}
|
||||
|
||||
templ Form(counter int) {
|
||||
// /show?team=x-men&member=wolverine
|
||||
// hx-get="/xsample/counterchange?type=min&counter"
|
||||
// /xsample/counterchange?type=min&counter=
|
||||
<div>
|
||||
<a
|
||||
class="btn btn-primary"
|
||||
type="submit"
|
||||
name="add"
|
||||
hx-target="#chgss"
|
||||
hx-swap="outerHTML"
|
||||
hx-get={ "/xsample/counter?type=plus&counter=" + strconv.Itoa(counter) }
|
||||
>+1</a>
|
||||
</div>
|
||||
<div>
|
||||
<a
|
||||
class="btn btn-danger"
|
||||
type="submit"
|
||||
name="min"
|
||||
hx-target="#chgss"
|
||||
hx-swap="outerHTML"
|
||||
hx-get={ "/xsample/counter?type=min&counter=" + strconv.Itoa(counter) }
|
||||
>-1</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssCtr() {
|
||||
}
|
||||
|
||||
templ JsCtr() {
|
||||
}
|
||||
|
||||
templ Page(counter int) {
|
||||
@layout.PlaygroundLayout("Coba counter", CssCtr(), JsCtr()) {
|
||||
<div id="chgss">
|
||||
@Counts(counter)
|
||||
@Form(counter)
|
||||
</div>
|
||||
}
|
||||
}
|
||||
package xsample
|
||||
|
||||
import "strconv"
|
||||
import (
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ Counts(counter int) {
|
||||
<div id="xyzz">counter: { strconv.Itoa(counter) }</div>
|
||||
}
|
||||
|
||||
templ Form(counter int) {
|
||||
// /show?team=x-men&member=wolverine
|
||||
// hx-get="/xsample/counterchange?type=min&counter"
|
||||
// /xsample/counterchange?type=min&counter=
|
||||
<div>
|
||||
<a
|
||||
class="btn btn-primary"
|
||||
type="submit"
|
||||
name="add"
|
||||
hx-target="#chgss"
|
||||
hx-swap="outerHTML"
|
||||
hx-get={ "/xsample/counter?type=plus&counter=" + strconv.Itoa(counter) }
|
||||
>+1</a>
|
||||
</div>
|
||||
<div>
|
||||
<a
|
||||
class="btn btn-danger"
|
||||
type="submit"
|
||||
name="min"
|
||||
hx-target="#chgss"
|
||||
hx-swap="outerHTML"
|
||||
hx-get={ "/xsample/counter?type=min&counter=" + strconv.Itoa(counter) }
|
||||
>-1</a>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ CssCtr() {
|
||||
}
|
||||
|
||||
templ JsCtr() {
|
||||
}
|
||||
|
||||
templ Page(counter int) {
|
||||
@layout.PlaygroundLayout("Coba counter", CssCtr(), JsCtr()) {
|
||||
<div id="chgss">
|
||||
@Counts(counter)
|
||||
@Form(counter)
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,21 +1,21 @@
|
||||
package xsample
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ HelloWorld(title string) {
|
||||
<div>{ title }</div>
|
||||
}
|
||||
|
||||
templ CssHelo() {
|
||||
}
|
||||
|
||||
templ JsHelo() {
|
||||
}
|
||||
|
||||
templ ShowHelo(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
package xsample
|
||||
|
||||
import (
|
||||
"cpone/layout"
|
||||
)
|
||||
|
||||
templ HelloWorld(title string) {
|
||||
<div>{ title }</div>
|
||||
}
|
||||
|
||||
templ CssHelo() {
|
||||
}
|
||||
|
||||
templ JsHelo() {
|
||||
}
|
||||
|
||||
templ ShowHelo(title string, cmp templ.Component, css templ.Component, js templ.Component) {
|
||||
@layout.PlaygroundLayout(title, css, js) {
|
||||
@cmp
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,35 +1,35 @@
|
||||
package xtemplmulti
|
||||
|
||||
import "cpone/models"
|
||||
|
||||
func stringToTemplComp(textAll string) templ.Component {
|
||||
return templ.ComponentFunc(func(ctx context.Context, w io.Writer) error {
|
||||
_, err := io.WriteString(w, textAll)
|
||||
return err
|
||||
})
|
||||
}
|
||||
|
||||
templ MainXTemplMulti(arrString []models.XtemplModel) {
|
||||
<div id="dataMhs" style="margin-bottom: 20px">
|
||||
<table>
|
||||
<tr>
|
||||
<td>Jarot</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="dataGuru" style="margin-bottom: 20px">
|
||||
<table>
|
||||
<tr>
|
||||
<td>Desy</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
for _, v := range arrString {
|
||||
{ v.NameTempl }
|
||||
{ v.HtmlString }
|
||||
|
||||
@stringToTemplComp(v.HtmlString)
|
||||
}
|
||||
|
||||
package xtemplmulti
|
||||
|
||||
import "cpone/models"
|
||||
|
||||
func stringToTemplComp(textAll string) templ.Component {
|
||||
return templ.ComponentFunc(func(ctx context.Context, w io.Writer) error {
|
||||
_, err := io.WriteString(w, textAll)
|
||||
return err
|
||||
})
|
||||
}
|
||||
|
||||
templ MainXTemplMulti(arrString []models.XtemplModel) {
|
||||
<div id="dataMhs" style="margin-bottom: 20px">
|
||||
<table>
|
||||
<tr>
|
||||
<td>Jarot</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="dataGuru" style="margin-bottom: 20px">
|
||||
<table>
|
||||
<tr>
|
||||
<td>Desy</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
for _, v := range arrString {
|
||||
{ v.NameTempl }
|
||||
{ v.HtmlString }
|
||||
|
||||
@stringToTemplComp(v.HtmlString)
|
||||
}
|
||||
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user