{include file="header.html"}

{box title="Your documents"}

<style>

	#file-status {
		margin-top: 1em;
	}

	.awaits-scan {
		margin-bottom: 0.5em;
		margin-top: 0.5em;
		margin-left: 1em;
	}

	.document-attachment:not(:last-child) {
		margin-bottom: 0.6em;
	}

</style>

{if $sms_active}
<div class="modal fade" id="authcode-dialog" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="authcode-dialog" aria-hidden="true">
	<div class="modal-dialog modal-dialog-centered" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">{trans("Authorization")}</h4>
				{button class="close" data_dismiss="modal" icon="close" label="Close"}
			</div>
			<div class="modal-body">
				<div class="alert" role="alert" style="display: none;">
				</div>
				<div class="form-group">
					<form method="post" action="?m=documents&smsauth=1&check=1" name="authcode" id="authcode-form">
						<label for="authcode" class="font-weight-bold">{trans("Enter code:")}</label>
						<input type=text" name="authcode" id="authcode" autocomplete="off"
							   placeholder="{trans("... which you received on your mobile phone")}"
								{userpaneltip class="form-control" trigger="authcode"} />
						<input type="hidden" name="documentid" class="documentid" value="{if isset($documentid)}{$documentid}{else}0{/if}">
					</form>
				</div>
			</div>
			<div class="modal-footer">
				{button class="btn btn-danger submit-button" accesskey="S" icon="submit" label="{trans("<!helpdesk>Submit")}" form="authcode-form" formnovalidate=true}
				{button class="btn btn-secondary" data_dismiss="modal" icon="close" label="Close"}
			</div>
		</div>
	</div>
</div>
{/if}

{if $scan_active}
<div class="modal fade" id="newscan-dialog" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="newscan-dialog" aria-hidden="true">
	<div class="modal-dialog modal-dialog-centered" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">{trans("Document submission")}</h4>
				{button class="close" data_dismiss="modal" icon="cancel"}
			</div>
			<div class="modal-body">
				<div class="form-group">
					<form method="post" action="?m=documents" id="newscan-form" name="newscan" enctype="multipart/form-data">
						<label for="scans" class="font-weight-bold">{trans("Select scan file:")}</label>
						<input type="file" name="files[]" id="scans"
							{userpaneltip class="form-control-file" text="Enter path to file or click 'Browse' button" trigger="files"}
							accept="application/pdf,image/jpeg,image/png"
							multiple>
						<input type="hidden" id="post_max_size" value="{$post_max_size.bytes}">
						<input type="hidden" id="upload_max_filesize" value="{$upload_max_filesize.bytes}">
						<div id="file-status" class="alert alert-danger"{if !isset($error.files)} style="display: none;"{/if}>
							{if isset($error.files)}
								{$error.files}
							{/if}
						</div>
						<small class="form-text">
							{t a=$post_max_size.text}Maximum total file size: $a{/t}
						</small>
						<small class="form-text">
							{t a=$upload_max_filesize.text}Maximum single file size: $a{/t}
						</small>
						<input type="hidden" name="documentid" class="documentid" value="{if isset($documentid)}{$documentid}{else}0{/if}">
					</form>
				</div>
			</div>
			<div class="modal-footer">
				{button class="btn btn-danger submit-button" form="newscan-form" formnovalidate=true accesskey="S" icon="submit" label="<!documents>Submit" disabled=true}
				{button class="btn btn-secondary" data_dismiss="modal" icon="close" label="Close"}
			</div>
		</div>
	</div>
</div>
{/if}

<div class="table-responsive">
	<table class="table table-sm table-hover table-bordered table-striped table-condensed">
		{if $documents}
			<thead class="bg-secondary font-weight-bold lms-userpanel-table-header">
				<th>{trans("Number:")}</th>
				<th>{trans("Type:")}</th>
				<th>{trans("Created:")}</th>
				<th>{trans("Period:")}</th>
				<th>{trans("Confirmation")}</th>
				<th>&nbsp;</th>
			</thead>
		{/if}
		{foreach $documents as $doc}
			<tr class="align-middle p-2 {if !$doc.closed && ($doc.confirmdate <= 0 || $doc.confirmdate < $smarty.now)}text-muted{/if}">
				<td>{number number=$doc.number template=$doc.template time=$doc.cdate customerid=$doc.customerid}</td>
				<td>{assign var=type value=$doc.type}{$_DOCTYPES.$type}</td>
				<td>{$doc.cdate|date_format:"Y-m-d"}</td>
				<td>
					{if ($doc.type == $smarty.const.DOC_CONTRACT) || ($doc.type == $smarty.const.DOC_ANNEX)}
						{if $doc.fromdate}
							{$doc.fromdate|date_format:"Y-m-d"}
						{/if}
						{if $doc.todate}
							- {$doc.todate|date_format:"Y-m-d"}
						{else}
							{if $doc.fromdate}
								-
							{/if}
							{trans("indefinitely")}
						{/if}
					{/if}
				</td>
				<td>
					{if $doc.confirm_type == $smarty.const.DOC_CLOSED_AFTER_CUSTOMER_SMS}
						{icon name="sms"}
						{$doc.confirm_date|date_format:'Y/m/d H:i:s'}
					{elseif $doc.confirm_type == $smarty.const.DOC_CLOSED_AFTER_CUSTOMER_SCAN}
						{icon name="sign"}
						{$doc.confirm_date|date_format:'Y/m/d H:i:s'}
					{/if}
				</td>
				<td>
					{if $doc.closed
						|| ConfigHelper::checkConfig('userpanel.show_unapproved_document_attachments')
						|| ($doc.confirmdate > 0 && $doc.confirmdate >= $smarty.now) || $doc.confirmdate == -1}
						<div class="container">
							{foreach $doc.attachments as $docattach}
								<div class="row document-attachment">
									<div class="col-md-auto">
										{if $docattach.type == 1}
											{button class="btn btn-primary" href="?m=documents&f=docview&id={$doc.id}&attachmentid={$docattach.id}" external=true icon="view" label="View"}
										{else}
											{button class="btn btn-primary" href="?m=documents&f=docview&id={$doc.id}&attachmentid={$docattach.id}" external=true icon="document" label="{$docattach.filename}"}
										{/if}
										{if !$doc.closed && ($docattach.type == 1 || $doc.only_other_attachments && $docattach@last) && $doc.confirmdate != -1}
											{if $scan_active}
												{button class="btn btn-primary" data_toggle="modal" data_target="#newscan-dialog" data_document_id="{$doc.id}" icon="upload" label="Submit scan"}
											{/if}
											{if $sms_active}
												{button class="btn btn-primary" data_toggle="modal" data_target="#authcode-dialog" data_document_id="{$doc.id}" icon="confirm" label="<!userpanel>Confirm"}
											{/if}
										{/if}
									</div>
								</div>
								{if !$doc.closed && ($docattach.type == 1 || $doc.only_other_attachments && $docattach@last)}
									<div class="row">
										{if $scan_active}
											<div class="awaits-scan col-md-auto alert alert-warning">
												{if $doc.confirmdate == -1}
													{trans("awaits for operator signed document scan review")}
												{else}
													{trans("awaits for signed document scan submission")}
												{/if}
											</div>
										{/if}
										{if $sms_active && $doc.confirmdate != -1}
											<div class="awaits-scan col-md-auto alert alert-warning">
												{trans("awaits for your approval")}
											</div>
										{/if}
									</div>
								{/if}
							{/foreach}
						</div>
					{else}
						{trans("not approved")}
					{/if}
				</td>
			</tr>
		{foreachelse}
			<tr>
				<td colspan="6" class="text-center">
					{trans("No such documents on your account.")}
				</td>
			</tr>
		{/foreach}
	</table>
</div>

<script>

	$(function() {
		{if isset($error.files)}
		$('[href="#userdocsbox"]').tab('show');
		$('#newscan-dialog').modal('show');
		{/if}

		function check_file_attachments() {
			var scans = $('#scans');
			$('#file-status').hide().text();
			if (scans.get(0).files.length) {
				var error = '';
				var post_max_size = parseInt($('#post_max_size').val());
				var upload_max_filesize = parseInt($('#upload_max_filesize').val());
				var total_size = 0;
				var acceptedFileTypes = scans.attr('accept').split(',');
				$.each(scans.get(0).files, function (index, file) {
					if (upload_max_filesize && file.size > upload_max_filesize) {
						error = '{trans("One from files is too large!")}';
					}
					total_size += file.size;

					if (acceptedFileTypes.indexOf(file.type) == -1) {
						error = '{trans("One from files has invalid type!")}';
					}
				});
				if (post_max_size && total_size > post_max_size) {
					error = '{trans("Total file size is too large!")}';
				}
				if (error.length) {
					$('#file-status').text(error).show();
					return false;
				}
				return true;
			} else {
				return false;
			}
		}

		$('#scans').change(function() {
			$('#newscan-dialog .submit-button').prop('disabled', !check_file_attachments());
		});

		$('#newscan-dialog .submit-button').click(function() {
			if (check_file_attachments()) {
				document.newscan.submit();
			}
		});

		$('[data-target="#newscan-dialog"]').click(function() {
			$('#newscan-dialog .documentid').val($(this).attr('data-document-id'));
		});

		$('[data-target="#authcode-dialog"]').click(function() {
			$('#authcode-dialog .submit-button').attr('disabled', 'disabled');
			$('#authcode-dialog .documentid').val($(this).attr('data-document-id'));
			$.ajax({
				method: "POST",
				url: '?m=documents&smsauth=1&send=1',
				dataType: 'json',
				data: {
					documentid: parseInt($('#authcode-dialog .documentid').val())
				},
				success: function(result) {
					if (result.errors.length) {
						$('#authcode-dialog .alert').removeClass('alert-primary').addClass('alert-danger')
							.html(result.errors.join('<br>')).show();
					} else {
						$('#authcode-dialog .alert').removeClass('alert-danger').addClass('alert-primary')
							.html("{trans("Authorization code has been sent to you mobile phone.")}").show();
					}
					$('#authcode-dialog .submit-button').removeAttr('disabled');
				}
			});
		});

		$('#authcode-dialog').on('hidden.bs.modal', function() {
			if ($(this).find('.submit-button').length) {
				$('#authcode-dialog .alert').html('').hide();
				$('#authcode').val(null);
			} else {
				location.reload();
			}
		}).on('shown.bs.modal', function() {
			$('#authcode').focus();
		}).find('form').submit(function(e) {
			$('#authcode-dialog .submit-button').attr('disabled', 'disabled');
			$.ajax({
				method: "POST",
				url: $(this).attr('action'),
				dataType: "json",
				data: {
					code: $('#authcode').val(),
					documentid: parseInt($('#authcode-dialog .documentid').val())
				},
				success: function(result) {
					if (result.errors.length) {
						$('#authcode-dialog .alert').removeClass('alert-primary').addClass('alert-danger')
							.html(result.errors.join('<br>')).show();
					} else {
						result.info.unshift("{trans("Authorization code is valid! Document has been confirmed and your services will be activated in a few moments.")}");
						$('#authcode-dialog .alert').removeClass('alert-danger').addClass('alert-primary')
							.html(result.info.join('<br>')).show();
						$('#authcode-dialog').find('.documentid').siblings().hide().end().end().find('.submit-button').remove();
					}
					$('#authcode-dialog .submit-button').removeAttr('disabled');
				}
			});
			e.preventDefault();
		}).end().find('.submit-button').click(function() {
			$('#authcode-dialog .submit-button').attr('disabled', 'disabled');
			$('#authcode-dialog form').submit();
		});
	});

</script>
{/box}

{include file="footer.html"}