{extend name="../../base/view/common/base" /}
<!-- Body -->
{block name="body"}
<form class="layui-form p-page">
	<h3 class="pb-3">Employee Contract Details</h3>
	<table class="layui-table layui-table-form">
		<tr>
			<td class="layui-td-gray">Contract Category</td>
			<td>{$detail.cate_str}</td>
			<td class="layui-td-gray">Contract Type</td>
			<td>{$detail.types_str}</td>
		</tr>
		{gt name="$detail.renewal_pid" value="0"}
		<tr>
			<td class="layui-td-gray">Renewal Parent Agreement</td>
			<td colspan="3"><a class="blue" href="/user/laborcontract/view?id={$detail.renewal_pid}">{$detail.renewal_ptitle}</a></td>
		</tr>
		{/gt}
		{gt name="$detail.change_pid" value="0"}
		<tr>
			<td class="layui-td-gray">Change Parent Agreement</td>
			<td colspan="3"><a class="blue" href="/user/laborcontract/view?id={$detail.change_pid}">{$detail.change_ptitle}</a></td>
		</tr>
		{/gt}
		<tr>
			<td class="layui-td-gray">Employee Name</td>
			<td>{$detail.user_name}</td>
			<td class="layui-td-gray">Contracting Company</td>
			<td>{$detail.enterprise}</td>
		</tr>
		<tr>
			<td class="layui-td-gray">Contract Name</td>
			<td>{$detail.title}</td>
			<td class="layui-td-gray">Contract Code</td>
			<td>{$detail.code}</td>
		</tr>
		<tr>
			<td class="layui-td-gray">Signing Date</td>
			<td>{$detail.sign_time}</td>
			<td class="layui-td-gray">Contract Attribute</td>
			<td>{$detail.properties_str}</td>
		</tr>
		</tr>
		<tr>			
			<td class="layui-td-gray-2">Effective Date</td>
			<td>{$detail.start_time}</td>
			<td class="layui-td-gray-2">Expiration Date</td>
			<td>{$detail.end_time}</td>
		</tr>
		{eq name="$detail.cate" value="1"}
		<tr>
			<td class="layui-td-gray-2">Trial Months</td>
			<td>{$detail.trial_months}</td>
			<td class="layui-td-gray-2">Trial End Date</td>
			<td>{$detail.trial_end_time}</td>
		</tr>
		<tr>	
			<td class="layui-td-gray-2">Trial Salary (CNY)</td>
			<td>{$detail.trial_salary}</td>
			<td class="layui-td-gray-2">Salary After Probation (CNY)</td>
			<td>{$detail.worker_salary}</td>
		</tr>
		{/eq}
		{in name="$detail.cate" value="2,3"}
		<tr>	
			<td class="layui-td-gray-2">Salary Cost (CNY)</td>
			<td>{$detail.worker_salary}</td>
		</tr>
		{/in}
		<tr>
			<td class="layui-td-gray">Remarks</td>
			<td colspan="3">{$detail.remark|default=''}</td>
		</tr>
		{notempty name="$detail.file_ids"}
		<tr>
			<td class="layui-td-gray"><strong>Attachments</strong></td>
			<td colspan="3">
				<div class="layui-row">
					{volist name="$detail.file_array" id="vo"}
					<div class="layui-col-md4" id="uploadFile{$vo.id}">{:file_card($vo,'view')}</div>
					{/volist}
				</div>
			</td>
		</tr>
		{/notempty}
		<tr>
			<td class="layui-td-gray">Contract Status</td>
			{eq name="$detail.status" value="1"}
			<td colspan="3"><span class="green">Active</span>, <span class="layui-btn layui-bg-red layui-btn-xs set-status" data-status="3">Terminate</span></td>
			{/eq}
			{eq name="$detail.status" value="2"}
			<td colspan="3"><span class="yellow">Expired</span></td>
			{/eq}
			{eq name="$detail.status" value="3"}
			<td colspan="3"><span class="red">Terminated</span>, <span class="layui-btn layui-bg-blue layui-btn-xs set-status" data-status="1">Restore</span></td>
			{/eq}
		</tr>
		<tr>
			<td class="layui-td-gray">Renewal Status</td>
			{empty name="$renewal"}
			<td colspan="3"><span class="green">Not renewed</span>{eq name="$detail.status" value="1"}, <a class="layui-btn layui-btn-xs" href="/user/laborcontract/add_renewal?id={$detail.id}">Add renewal contract</a>{/eq}</td>
			{else/}
			<td colspan="3"><span class="red">Renewed</span>, renewal date: {$renewal.create_time|date="Y-m-d"}. <a class="layui-btn layui-bg-blue layui-btn-xs" href="/user/laborcontract/view?id={$renewal.id}">Renewal details</a></td>
			{/empty}
		</tr>
		<tr>
			<td class="layui-td-gray">Change Status</td>
			{empty name="$change"}
			<td colspan="3"><span class="green">Not changed</span>{eq name="$detail.status" value="1"}, <a class="layui-btn layui-btn-xs" href="/user/laborcontract/add_change?id={$detail.id}">Add change contract</a>{/eq}</td>
			{else/}
			<td colspan="3"><span class="red">Changed</span>, change date: {$change.create_time|date="Y-m-d"}. <a class="layui-btn layui-bg-blue layui-btn-xs" href="/user/laborcontract/view?id={$change.id}">Change details</a></td>
			{/empty}
		</tr>
	</table>
</form>
{/block}
<!-- /Body -->

<!-- Script -->
{block name="script"}
<script>
	const id = {$detail.id};
	var moduleInit = ['tool'];
	function gouguInit() {
		var tool = layui.tool;
		$('body').on('click','.set-status',function(){
			let status = $(this).data('status');
			let tips='Are you sure you want to terminate this contract?';
			if(status==1){
				tips='Are you sure you want to restore this contract?';
			}
			layer.confirm(tips, { icon: 3, title: 'Confirm' }, function (index) {
				let callback = function (e) {
					layer.msg(e.msg);
					if (e.code == 0) {
						if(parent.layui.pageTable){
							parent.layui.pageTable.reload();
						}
						location.reload();
					}
				}
				tool.post("/user/laborcontract/set", {id:id,status:status}, callback);
				layer.close(index);
			});
			
		})
	}
</script>
{/block}
<!-- /Script -->