234 lines
9.9 KiB
Plaintext
234 lines
9.9 KiB
Plaintext
@model CompanyManagment.App.Contracts.Workshop.TakePictureModel
|
|
@{
|
|
string adminVersion = _0_Framework.Application.Version.AdminVersion;
|
|
int index = 1;
|
|
<link href="~/AssetsAdminNew/rollcall/css/modaltakeimages.css?ver=@adminVersion" rel="stylesheet" />
|
|
}
|
|
|
|
<form role="form" method="post" name="create-form" id="create-form" autocomplete="off">
|
|
|
|
<div class="modal-content">
|
|
|
|
<div id="desktopDisplay">
|
|
<div class="modal-header d-block text-center mb-2">
|
|
<button type="button" class="btn-close position-absolute text-start" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
<h5 class="modal-title" id="startBuyLabel">بارگذاری عکس پرسنل</h5>
|
|
<h6 class="mb-2">@Model.Name</h6>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="d-flex flex-column justify-content-center h-75 text-center">
|
|
<div>
|
|
<svg width="100px" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 621.6 721.91">
|
|
<defs>
|
|
<style>
|
|
.clsd-1 {
|
|
fill: url(#linear-gradient-2);
|
|
}
|
|
|
|
.clsd-2 {
|
|
fill: url(#linear-gradient-3);
|
|
}
|
|
|
|
.clsd-3 {
|
|
fill: url(#linear-gradient);
|
|
}
|
|
</style>
|
|
<linearGradient id="linear-gradient" x1="0" y1="481.82" x2="621.6" y2="481.82" gradientUnits="userSpaceOnUse">
|
|
<stop offset="0" stop-color="#30c1c1"/>
|
|
<stop offset="1" stop-color="#087474"/>
|
|
</linearGradient>
|
|
<linearGradient id="linear-gradient-2" x1="217.07" y1="187.47" x2="523.83" y2="187.47" xlink:href="#linear-gradient"/>
|
|
<linearGradient id="linear-gradient-3" x1="1.3" y1="146.6" x2="395.56" y2="146.6" xlink:href="#linear-gradient"/>
|
|
</defs>
|
|
<polygon class="clsd-3" points="0 328.82 129.91 244.95 129.91 453.87 310.8 562.4 488.4 453.87 488.4 355.2 310.8 355.2 488.4 241.73 621.6 241.73 621.6 541.02 310.8 721.91 0 541.02 0 328.82"/>
|
|
<polygon class="clsd-1" points="217.07 309.16 217.07 192.4 426.8 65.78 523.83 123.33 217.07 309.16"/>
|
|
<polyline class="clsd-2" points="308.61 0 395.56 47.69 1.3 293.19 1.3 184.66 308.61 0"/>
|
|
</svg>
|
|
<h5 class="mt-2 title-logo">سامانه هوشمند گزارشگیر</h5>
|
|
</div>
|
|
<div>
|
|
<p>برای ساعات حضور و غیاب میباست از گوشی استفاده نمایید!</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="mobileDisplay">
|
|
<div class="modal-header d-block text-center mb-2">
|
|
<button type="button" class="btn-close position-absolute text-start" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
<h5 class="modal-title" id="startBuyLabel">بارگذاری عکس پرسنل</h5>
|
|
<h6 class="mb-2">@Model.Name</h6>
|
|
</div>
|
|
|
|
<div class="modal-body clearfix">
|
|
|
|
|
|
@* <div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
عکس اول
|
|
</div>
|
|
<div class="panel-body">
|
|
<div id="my_camera" style="margin: auto; display: none"></div>
|
|
<div id="video" style="margin: auto;"></div>
|
|
|
|
<div style="margin: 10px 0 0 0; text-align: center;">
|
|
<input type="button" class="btn btn-success" value="گرفتن عکس اول" onclick="take_snapshot1()"/>
|
|
<input type="button" class="btn btn-success" value="گرفتن عکس دوم" onclick="take_snapshot2()"/>
|
|
</div>
|
|
</div>
|
|
</div> *@
|
|
|
|
|
|
|
|
<div class="row">
|
|
<div class="col-xs-12">
|
|
<div class="panel panel-default">
|
|
<form asp-page="./Index" asp-page-handler="TakePicture" id="test"
|
|
method="post"
|
|
data-ajax="true"
|
|
data-callback=""
|
|
data-action="Refresh"
|
|
enctype="multipart/form-data">
|
|
<div class="panel-body text-center">
|
|
<div id="result1" style="margin-bottom: 5px;"></div>
|
|
<div id="result2" style="margin-bottom: 5px;"></div>
|
|
<div id="demoResult1" class="image-show">
|
|
<button type="button" class="upload-image1">
|
|
<p class="textUpload @(Model.HasPicture ? "textUploaded" : "")">
|
|
@(Model.HasPicture ? "عکس اول" : "بارگذاری عکس اول")
|
|
</p>
|
|
</button>
|
|
@* <div class="loadingImage" id="loadingImage1">
|
|
<div class="spinner-border" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
</div> *@
|
|
@if (Model.HasPicture)
|
|
{
|
|
<img style="width: 100%; height: 100%; border-radius:10px;" data-uri="data:image/jpeg;base64,@Model.Pic1" id="pic1" src="data:image/jpeg;base64,@Model.Pic1" />
|
|
}
|
|
</div>
|
|
<div id="demoResult2" class="image-show">
|
|
<button type="button" class="upload-image2">
|
|
<p class="textUpload @(Model.HasPicture ? "textUploaded" : "")">
|
|
@(Model.HasPicture ? "عکس دوم" : "بارگذاری عکس دوم")
|
|
</p>
|
|
</button>
|
|
@* <div class="loadingImage" id="loadingImage2">
|
|
<div class="spinner-border" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
</div> *@
|
|
@if (Model.HasPicture)
|
|
{
|
|
<img style="width: 100%; height: 100%; border-radius: 10px;" id="pic2" data-uri="data:image/jpeg;base64,@Model.Pic2" src="data:image/jpeg;base64,@Model.Pic2"/>
|
|
}
|
|
</div>
|
|
|
|
|
|
<div class="row mt-3">
|
|
<div class="col-12 position-relative overflow-hidden" style="height: 20px; direction: ltr;">
|
|
<div class="spinner-loading-progress loading" style="display: none; border-radius: 6px; position: unset;">
|
|
<span id="progressBar" style="color: #ffffff"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mt-4">
|
|
<div class="col-6 text-end">
|
|
@* <a asp-page="/Company/Task/Index" id="cancel" class="btn-tm-cancel m-1 text-white" type="button"> *@
|
|
<button class="w-100 btn-cancel text-white cancelAndRefresh" data-bs-dismiss="modal" aria-label="Close" type="button" style="display: block">
|
|
<span>انصراف</span>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="col-6 text-start">
|
|
<button type="button" onclick="set()" class="w-100 btn-primary disable position-relative overflow-auto" id="SaveImageEmployee">
|
|
<span>ذخیره</span>
|
|
|
|
<div class="spinner-loading loading" style="display: none">
|
|
<span class="spinner-border spinner-border-sm loading text-white" role="status" aria-hidden="true"></span>
|
|
</div>
|
|
</button>
|
|
@* <a href="#" id="save" class="btn-tm-save">ارسال</a> *@
|
|
</div>
|
|
</div>
|
|
|
|
<input type="hidden" id="workshopId" asp-for="@Model.WorkshopId" value="@Model.WorkshopId" />
|
|
<input type="hidden" id="employeeId" asp-for="@Model.EmployeeId" value="@Model.EmployeeId" />
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
@* <div class="row m-t-10">
|
|
<div class="col-md-9"></div>
|
|
<div class="modal2-btns col-md-3">
|
|
<a type="button" id="closeRotate" class="btn pull-left m-l-10" style="background-color: #e7f2f3; border-radius: 15px; box-shadow: 1px 1px 5px 2px rgb(0 0 0 / 19%);" data-dismiss="modal" data-parent-modal="#edit-modal">بستن</a>
|
|
|
|
</div>
|
|
</div> *@
|
|
</div>
|
|
|
|
@* <div class="modal-footer justify-content-center align-items-center">
|
|
<div class="row">
|
|
<div class="col-6 text-end">
|
|
<button type="button" class="btn-cancel2" id="prev-step">انصراف</button>
|
|
</div>
|
|
<div class="col-6 text-start">
|
|
<button type="button" class="btn-register" id="next-step">مرحله بعد</button>
|
|
</div>
|
|
</div>
|
|
</div> *@
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
|
|
@* Camera Modal *@
|
|
<div class="md-modal md-effect-12">
|
|
<div class="md-content" style="width: 100%;">
|
|
<div class="panel panel-default">
|
|
<div class="panel-body" style="width: 360px;height: 360px;text-align: center;margin: auto;">
|
|
@*<div id="my_camera" style="margin: auto; display: none;"></div>*@
|
|
@* <div id="video" style="margin: auto;"></div> *@
|
|
@* <div id="video" style="margin: auto; width: 100%; height: 100%;"></div> *@
|
|
<div style="display: block; position: relative; width: 360px; height: 360px;">
|
|
@*<div id="video" style="position: absolute; top: 0px; right: 0; margin: auto; width: 100%; height: 100%;"></div>*@
|
|
<video id="videoElement" autoplay></video>
|
|
<img src="~/AssetsClient/images/face.png" style="position: absolute; top: 0; right: 0; width: 360px; transform: scale(1.006); border-radius: 10px;" />
|
|
</div>
|
|
|
|
<div style="margin: 10px 0 0 0; text-align: center;">
|
|
<input type="button" class="btn btn-success take_snapshot1" style="display: none;" value="گرفتن عکس اول" onclick="take_snapshot1()"/>
|
|
<input type="button" class="btn btn-success take_snapshot2" style="display: none;" value="گرفتن عکس دوم" onclick="take_snapshot2()"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="camera_close">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" width="35" height="35">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="md-overlay"></div>
|
|
|
|
@* <script src="~/webcamjs/webcam.js"></script> *@
|
|
<script src="~/AssetsClient/libs/jslib-html5-camera/jslib-html5-camera-photo.min.js"></script>
|
|
<script>
|
|
var antiForgeryToken = $('@Html.AntiForgeryToken()').val();
|
|
var takePictureAjax = `@Url.Page("./EmployeeUploadPicture", "TakePicture")`;
|
|
var hasPicture = `@(Model.HasPicture)` === "True" ? true : false;
|
|
var checkFace1 = `@(Model.HasPicture)` === "True" ? true : false;
|
|
var checkFace2 = `@(Model.HasPicture)` === "True" ? true : false;
|
|
var hasErrorPic1 = false;
|
|
var hasErrorPic2 = false;
|
|
</script>
|
|
<script src="~/weights/face-api.js"></script>
|
|
<script src="~/AssetsAdminNew/rollcall/js/modaltakeimages.js?ver=adminVersion"></script> |