andy/corporate_portal_westerindo
1
0
Fork 0
Code Issues 13 Pull Requests Packages Projects Releases Wiki Activity

step 15 : add master dokter dengan foto dan tanpa foto

Browse Source
This commit is contained in:
sindhu
2024-06-06 08:57:05 +07:00
parent 4f322038ac
commit 4d7b3f8299
16 changed files with 614 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
component/customuploadfotodokterv0/customuploadfotodokterv0.templ Normal file
View File

@@ -0,0 +1,76 @@
package customuploadfotodokterv0
import "cpone/models"
templ CustomUploadFotoWithPreviewDokterV0(prm models.CustomUploadFotoPrmV0) {
<div class="row">
<div class="col-4">
<img
id={ prm.ID + "-preview-image" }
if prm.LinkFoto == "" {
src="asset-corporate-portal/media/person/person.png"
} else {
src={ prm.LinkFoto }
}
style="display: block; width: 13vw"
/>
</div>
</div>
<div class="row mt-5">
<div class="col-4">
<button
class="btn bg-primary-transparent text-center text-primary"
style="width: 13vw; font-weight: 600"
id="updateFotoButton"
type="button"
>
{ prm.Label }
</button>
<input
type="file"
id={ prm.ID }
name={ prm.Name }
accept={ prm.Accept }
style="display: none;"
/>
<input
type="text"
style="display: none;"
name="doctorfotobase64string"
id="doctorfotobase64string"
value={ prm.Value }
/>
</div>
</div>
@OnSelect(prm.ID)
}
script OnSelect(id string) {
const updateFotoButton = document.getElementById('updateFotoButton');
const fileInput = document.getElementById(id);
const previewImage = document.getElementById(id+"-preview-image");
updateFotoButton.addEventListener('click', function() {
fileInput.click();
});
fileInput.addEventListener('change', function() {
const fileName = fileInput.files[0].name;
if (fileInput.files.length > 0) {
if (fileInput.files[0].size > 500000) {
fileInput.value = "";
Swal.fire("Warning", "File is too big!", "warning");
} else {
const reader = new FileReader();
reader.onload = function(e) {
const base64String = e.target.result;
previewImage.src = base64String;
$('#doctorfotobase64string').val(base64String)
};
reader.readAsDataURL(fileInput.files[0]);
// previewImage.src = URL.createObjectURL(fileInput.files[0]);
}
}
})
}

183
component/customuploadfotodokterv0/customuploadfotodokterv0_templ.go Normal file
View File

@@ -0,0 +1,183 @@
// Code generated by templ - DO NOT EDIT.
// templ: version: v0.2.663
package customuploadfotodokterv0
//lint:file-ignore SA4006 This context is only used if a nested component is present.
import "github.com/a-h/templ"
import "context"
import "io"
import "bytes"
import "cpone/models"
func CustomUploadFotoWithPreviewDokterV0(prm models.CustomUploadFotoPrmV0) templ.Component {
return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
if !templ_7745c5c3_IsBuffer {
templ_7745c5c3_Buffer = templ.GetBuffer()
defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
}
ctx = templ.InitializeContext(ctx)
templ_7745c5c3_Var1 := templ.GetChildren(ctx)
if templ_7745c5c3_Var1 == nil {
templ_7745c5c3_Var1 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"row\"><div class=\"col-4\"><img id=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var2 string
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(prm.ID + "-preview-image")
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `component\customuploadfotodokterv0\customuploadfotodokterv0.templ`, Line: 9, Col: 34}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if prm.LinkFoto == "" {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" src=\"asset-corporate-portal/media/person/person.png\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
} else {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" src=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var3 string
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(prm.LinkFoto)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `component\customuploadfotodokterv0\customuploadfotodokterv0.templ`, Line: 13, Col: 23}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" style=\"display: block; width: 13vw\"></div></div><div class=\"row mt-5\"><div class=\"col-4\"><button class=\"btn bg-primary-transparent text-center text-primary\" style=\"width: 13vw; font-weight: 600\" id=\"updateFotoButton\" type=\"button\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var4 string
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(prm.Label)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `component\customuploadfotodokterv0\customuploadfotodokterv0.templ`, Line: 27, Col: 15}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</button> <input type=\"file\" id=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var5 string
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(prm.ID)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `component\customuploadfotodokterv0\customuploadfotodokterv0.templ`, Line: 31, Col: 15}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" name=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var6 string
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(prm.Name)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `component\customuploadfotodokterv0\customuploadfotodokterv0.templ`, Line: 32, Col: 19}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" accept=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var7 string
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(prm.Accept)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `component\customuploadfotodokterv0\customuploadfotodokterv0.templ`, Line: 33, Col: 23}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" style=\"display: none;\"> <input type=\"text\" style=\"display: none;\" name=\"doctorfotobase64string\" id=\"doctorfotobase64string\" value=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var8 string
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(prm.Value)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `component\customuploadfotodokterv0\customuploadfotodokterv0.templ`, Line: 41, Col: 21}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"></div></div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = OnSelect(prm.ID).Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if !templ_7745c5c3_IsBuffer {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
}
return templ_7745c5c3_Err
})
}
func OnSelect(id string) templ.ComponentScript {
return templ.ComponentScript{
Name: `__templ_OnSelect_d389`,
Function: `function __templ_OnSelect_d389(id){const updateFotoButton = document.getElementById('updateFotoButton');
const fileInput = document.getElementById(id);
const previewImage = document.getElementById(id+"-preview-image");
updateFotoButton.addEventListener('click', function() {
fileInput.click();
});
fileInput.addEventListener('change', function() {
const fileName = fileInput.files[0].name;
if (fileInput.files.length > 0) {
if (fileInput.files[0].size > 500000) {
fileInput.value = "";
Swal.fire("Warning", "File is too big!", "warning");
} else {
const reader = new FileReader();
reader.onload = function(e) {
const base64String = e.target.result;
previewImage.src = base64String;
$('#doctorfotobase64string').val(base64String)
};
reader.readAsDataURL(fileInput.files[0]);
// previewImage.src = URL.createObjectURL(fileInput.files[0]);
}
}
})
}`,
Call: templ.SafeScript(`__templ_OnSelect_d389`, id),
CallInline: templ.SafeScriptInline(`__templ_OnSelect_d389`, id),
}
}