@page
@model ServiceHost.Areas.AdminNew.Pages.Company.WorkFlow.IndexModel
@{
}


@{
    string clientVersion = _0_Framework.Application.Version.StyleVersion;
    ViewData["Title"] = " - " + "کارگاه";
}

@section Styles {
    <link href="~/assetsclient/css/card.css?ver=@clientVersion" rel="stylesheet" />
    <style>
        .countNumber span {
            background-color: #dd2a2a;
            width: 28px;
            display: flex;
            height: 28px;
            align-items: center;
            justify-content: center;
            border-radius: 24px;
            margin: 0 0 0 12px;
            color: #fff;
            font-size: 15px;
            font-weight: 700;
            padding: 2px 0 0 0;
        }
    </style>
}

<div class="container-fluid">
    <div class="row p-2">
        <div class="col p-0 m-0 d-flex align-items-center justify-content-between">
            <div class="col d-flex align-items-center justify-content-start">
                <img src="~/AssetsClient/images/icons/workflow.png" alt="" class="img-fluid me-2" style="width: 45px;" />
                <div>
                    <h4 class="title d-flex align-items-center">کارپوشه</h4>
                </div>
            </div>
            <div>
                <a asp-page="/Index" class="back-btn" type="button">
                    <span>بازگشت</span>
                </a>
            </div>
        </div>
    </div>
</div>

<div class="container-fluid">
    <div class="row p-2">
        <div class="profile-header position-relative">
            <img src="~/AssetsClient/images/profile-header.png" alt="" class="img-fluid">
        </div>
    </div>
</div>

<!-- Start Card Items -->
<div class="container-fluid">
    <div class="row p-2">
        <div class="d-grid card-area-workflow gap-2 p-0">

	        <div class="gwb-card">
		        <a asp-page="/Company/WorkFlow/EmployeesDocuments" class="click loadingButton">
			        <div class="d-flex align-items-center justify-content-between p-1 w-100">
				        <div class="d-flex align-items-center">
					        <img src="~/AssetsClient/images/insuranceList.png" alt="" class="img-fluid mx-1" width="50px" />
					        <div class="text-start ms-1">
						        <div class="card-title">بارگذاری مدارک توسط کارفرما</div>
					        </div>
				        </div>
						@if (@Model.EmployeeDocumentsAwaitingSubmitCount != 0)
				        {
					        <div class="countNumber">
						        <span>
									@(Model.EmployeeDocumentsAwaitingSubmitCount > 99 ? "+99" : Model.EmployeeDocumentsAwaitingSubmitCount)
						        </span>
					        </div>
				        }
			        </div>
			        <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>
		        </a>
	        </div>
			
	        <div class="gwb-card">
		        <a asp-page="/Company/WorkFlow/EmployeesNew" class="click loadingButton">
			        <div class="d-flex align-items-center justify-content-between p-1 w-100">
				        <div class="d-flex align-items-center">
					        <img src="~/AssetsClient/images/insuranceList.png" alt="" class="img-fluid mx-1" width="50px" />
					        <div class="text-start ms-1">
						        <div class="card-title">اعلام شروع بکار توسط کافرما</div>
					        </div>
				        </div>
				        <div class="countNumber" id="StartWorkCount">
					        <span></span>
				        </div>
			        </div>
			        <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>
		        </a>
	        </div>
			
			
	        <div class="gwb-card">
		        <a asp-page="/Company/WorkFlow/EmployeesLeftWork" class="click loadingButton">
			        <div class="d-flex align-items-center justify-content-between p-1 w-100">
				        <div class="d-flex align-items-center">
					        <img src="~/AssetsClient/images/insuranceList.png" alt="" class="img-fluid mx-1" width="50px" />
					        <div class="text-start ms-1">
						        <div class="card-title">اعلام ترک کار توسط کافرما</div>
					        </div>
				        </div>
				        <div class="countNumber" id="leftWorkCount">
					        <span></span>
				        </div>
			        </div>
			        <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>
		        </a>
	        </div>

	        @* 	        <div class="gwb-card">
		        <a asp-page="/Company/WorkFlow/Insurance" class="click loadingButton">
			        <div class="d-flex align-items-center justify-content-between p-1 w-100">
				        <div class="d-flex align-items-center">
					        <img src="~/AssetsClient/images/insuranceList.png" alt="" class="img-fluid mx-1" width="50px" />
					        <div class="text-start ms-1">
						        <div class="card-title">بیمه</div>
					        </div>
				        </div>
				        @if (@Model.InsuredEmployeesWithoutContractCount != 0)
				        {
					        <div class="countNumber">
						        <span>
							        @(Model.InsuredEmployeesWithoutContractCount > 99 ? "+99" : Model.InsuredEmployeesWithoutContractCount)
						        </span>
					        </div>
				        }
			        </div>
			        <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>
		        </a>
	        </div> *@

        </div>
    </div>
</div>
<!-- End Card Items -->



<div class="modal fade personalListModal" id="MainModal" tabindex="-1" data-bs-backdrop="static" aria-labelledby="personalListModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog modal-xxl modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-body p-0 d-flex justify-content-center" id="ModalContent">
            </div>
        </div>
    </div>
</div>

<script>
	var antiForgeryTokenLayout = $('@Html.AntiForgeryToken()').val();
</script>
@section Script {
    <script src="~/assetsclient/js/site.js?ver=@clientVersion"></script>

    <script>
		$(document).ready(function () {
			workFlowStartAndLeftWorkCountMenu();

			$('.loadingButton').on('click', function (e) {
				if (e.ctrlKey || e.metaKey) {
					return;
				}

				var button = $(this);
				var loadingDiv = button.find('.loading');
				loadingDiv.show();
			});
		});

		function workFlowStartAndLeftWorkCountMenu() {
			$.ajax({
				async: true,
				dataType: 'json',
				url: `@Url.Page("./Index", "StartAndLeftWorkCount")`,
				headers: { "RequestVerificationToken": antiForgeryTokenLayout },
				type: 'GET',
				success: function (response) {
					if (response.success) {
						if (response.dataStartWorkCount === 0) {
							$('#StartWorkCount').hide();
						} else {
							$('#StartWorkCount').show();
							var startWorkCount = response.dataStartWorkCount > 99 ? "+99" : response.dataStartWorkCount;
							$('#StartWorkCount span').text(startWorkCount);
						}

						if (response.dataLeftWorkCount === 0) {
							$('#leftWorkCount').hide();
						} else {
							$('#leftWorkCount').show();
							var leftWorkCount = response.dataLeftWorkCount > 99 ? "+99" : response.dataLeftWorkCount;
							$('#leftWorkCount span').text(leftWorkCount);
						}
					}
				},
				error: function (xhr, status, error) {
					console.error(xhr.responseText);
				}
			});
		}
	</script>
}