Backend-Api/ServiceHost/Areas/Client/Pages/Company/WorkFlow/Index.cshtml

@page
@using _0_Framework.Application
@using Microsoft.AspNetCore.Mvc.TagHelpers
@model ServiceHost.Areas.Client.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>
}

<!-- MAIN CONTENT -->
<div class="content-container">

    <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>@Model.WorkshopFullName</div>
                    </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 @(Model.HasRollCallService ? "" : "disable")" Permission="@SubAccountPermissionHelper.WorkFlowRollCallsPermissionCode">
                    <a asp-page="/Company/WorkFlow/RollCall" 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/contractList.png" alt="" class="img-fluid mx-1" width="50px" />
		                        <div class="text-start ms-1">
			                        <div class="card-title">حضور و غیاب</div>
		                        </div>
	                        </div>
	                        @* @if (@Model.CountRollCall != 0)
	                        { *@

	                        <div>
                                <div id="CountLoading" class="spinner-grow text-danger" role="status" style="display: flex;align-items: center;justify-content: center;margin: 0 0 0 10px;">
			                        <span class="visually-hidden">Loading...</span>
		                        </div>

                                <div class="countNumber" id="CountRollCallSection" style="display: none">
                                    <span id="CountRollCall"></span>
		                        </div>
	                        </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 disable" Permission="@SubAccountPermissionHelper.WorkFlowContractsAndCheckoutsPermissionCode">
                    <a class="click loadingButton">
	                    <div class="d-flex align-items-center justify-content-between p-1">
                            <div class="d-flex align-items-center">
			                    <img src="~/AssetsClient/images/checkoutList.png" alt="" class="img-fluid mx-1" width="50px" />
			                    <div class="text-start ms-1">
				                    <div class="card-title">قرارداد و فیش حقوقی</div>
			                    </div>
		                    </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 disable" Permission="@SubAccountPermissionHelper.WorkFlowInsurancesPermissionCode">
                    <a class="click loadingButton">
                        <div class="d-flex align-items-center justify-content-start p-1">
                            <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="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>
<!-- END MAIN CONTENT -->


<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>

@section Script {
    <script src="~/assetsclient/js/site.js?ver=@clientVersion"></script>

    <script>
	    $(document).ready(function () {
		    $('.loadingButton').on('click', function (e) {
			    if (e.ctrlKey || e.metaKey) {
				    return;
			    }

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

        $.ajax({
            contentType: 'charset=utf-8',
            dataType: 'json',
            type: 'GET',
            url: `@Url.Page("./Index", "CountRollCall")`,
            headers: { "RequestVerificationToken": $(`@Html.AntiForgeryToken()`).val() },
            success: function (response) {
	            $("#CountLoading").hide();
                if (response.countWorkFlow !== 0) {
		            $("#CountRollCallSection").show();
		            $('#CountRollCall').html(response.countWorkFlow);
	            }
			}
        });
    </script>
}