{extend name="../../base/view/common/base" /}
<!-- Body -->
{block name="body"}
<form class="layui-form p-page">
	<h3 class="pb-1">Add asset</h3>
	<table class="layui-table">
		<tr>
			<td class="layui-td-gray">Asset name<font>*</font></td>
			<td colspan="3">
				<input type="text" name="title"  placeholder="Please enter asset name" lay-verify="required" lay-reqText="Please enter asset name" class="layui-input">
			</td>
			<td class="layui-td-gray-2" rowspan="5">
			Asset thumbnail
			<button type="button" class="layui-btn layui-btn-sm" id="uploadImg">+ Upload image</button>
			</td>
			<td rowspan="5" style="width:252px;">
				  <div id="demo1" style="width: 240px; height:136px; overflow: hidden;">
					<img src="" style="max-width: 100%; height:136px;" />
					<input type="hidden" name="thumb" value="">
				  </div>
			</td>
		</tr>
		<tr>
			<td class="layui-td-gray">Asset code<font>*</font></td>
			<td>
				<input type="text" name="code"  value="{:get_codeno('ZC')}" class="layui-input" lay-verify="required">
			</td>
			<td class="layui-td-gray">Model<font>*</font></td>
			<td><input type="text" name="model"  value="" class="layui-input" lay-verify="required"></td>
		</tr>
		<tr>
			<td class="layui-td-gray-2">Category<font>*</font></td>
			<td>
			  <select name="cate_id" lay-verify="required" lay-reqText="Please select asset category">
				<option value="">Select category</option>
				{volist name=":set_recursion(get_base_data('PropertyCate'))" id="v"}
				<option value="{$v.id}">{$v.title}</option>
				{/volist}
			  </select>
			</td>
			<td class="layui-td-gray">Brand<font>*</font></td>
			<td>
				<select name="brand_id" lay-verify="required" lay-reqText="Please select brand">
				<option value="">Select brand</option>
				{volist name=":get_base_data('PropertyBrand')" id="v"}
				<option value="{$v.id}">{$v.title}</option>
				{/volist}
			  </select>
			</td>
		</tr>
		<tr>
			<td class="layui-td-gray">Warranty expiry date<font>*</font></td>
			<td><input type="text" name="quality_time"  readonly placeholder="Select warranty expiry date" class="layui-input tool-time" lay-verify="required" lay-reqText="Please select warranty expiry date"></td>
			<td class="layui-td-gray">Unit<font>*</font></td>
			<td>
				<select name="unit_id" lay-verify="required" lay-reqText="Please select unit">
				<option value="">Select unit</option>
				{volist name=":get_base_data('PropertyUnit')" id="v"}
				<option value="{$v.id}">{$v.title}</option>
				{/volist}
			  </select>
			</td>
		</tr>
		<tr>
			<td class="layui-td-gray">Assigned users</td>
			<td>
				<input type="text" name="users_name"  readonly placeholder="Select users" class="layui-input picker-admin" data-type="2">
				<input type="hidden" name="user_ids" value="">
			</td>
			<td class="layui-td-gray">Departments</td>
			<td><select id="user_dids" name="user_dids" xm-selected="" xm-select="select1" xm-select-skin="default"></select></td>
		</tr>
		<tr>
			<td class="layui-td-gray">Purchase price<font>*</font></td>
			<td><input type="text" name="price"  placeholder="Please enter purchase price" lay-verify="required|number" lay-reqText="Please enter purchase price" class="layui-input"></td>
			<td class="layui-td-gray">Purchase date<font>*</font></td>
			<td><input type="text" name="buy_time"  readonly placeholder="Select purchase date" lay-verify="required" lay-reqText="Please select purchase date" class="layui-input tool-time"></td>
			<td class="layui-td-gray">Annual depreciation rate (%)<font>*</font></td>
			<td><input type="text" name="rate"  placeholder="Please enter annual depreciation rate (no % needed)" lay-verify="required|number" lay-reqText="Please enter annual depreciation rate (no % needed)" class="layui-input"></td>
		</tr>
		<tr>
			<td class="layui-td-gray">Asset status<font>*</font></td>
			<td colspan="5">
				{volist name="$status" id="vo"}
				<input type="radio" name="status" value="{$key}" title="{$vo}">
				{/volist}
			</td>
		</tr>
		<tr>
			<td class="layui-td-gray">Asset source<font>*</font></td>
			<td colspan="5">
				{volist name="$source" id="vo"}
				{gt name="$key" value="0"}
				<input type="radio" name="source" value="{$key}" title="{$vo}">
				{/gt}
				{/volist}
			</td>
		</tr>
		<tr>
			<td class="layui-td-gray">Location</td>
			<td colspan="5"><input type="text" name="address"  placeholder="Please enter location" class="layui-input"></td>
		</tr> 
		<tr>
			<td class="layui-td-gray-2">
				<div class="layui-input-inline">Attachments</div>
				<div class="layui-input-inline">
					<button type="button" class="layui-btn layui-btn-xs" id="uploadBtn"><i class="layui-icon"></i></button>
				</div>
			</td>
			<td colspan="5">
				<div class="layui-row" id="uploadBox">
					<input type="hidden" data-type="file" name="file_ids" value="">
				</div>
			</td>
		</tr> 
		<tr>
			<td class="layui-td-gray" style="vertical-align:top;">Description</td>
			<td colspan="5">
				<textarea name="content" placeholder="Please enter content" class="layui-textarea" id="container"></textarea>
			</td>
		</tr>
	</table>
	<div class="pt-2">
		<button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">Submit</button>
		<button type="reset" class="layui-btn layui-btn-primary">Reset</button>
    </div>
</form>
{/block}
<!-- /Body -->

<!-- Script -->
{block name="script"}
<script>
const moduleInit = ['tool','formSelects','uploadPlus','oaPicker'];
function gouguInit() {
	var form = layui.form,tool=layui.tool,uploadPlus = layui.uploadPlus, formSelects = layui.formSelects;
	
	// Select department
	var selected = $('#department_ids').attr('xm-selected');
	formSelects.data('select1', 'server', {
		url: '/api/index/get_department_select',
		keyword: selected
	});
	// Single image upload
	var photoUpload = new uploadPlus({
		'use':'single',
		'target':'uploadImg',
		'callback':function(res){
			layer.msg(res.msg);
			if (res.code == 0) {
				// Upload success
				$('#demo1 input').attr('value', res.data.id);
				$('#demo1 img').attr('src', res.data.filepath);
			}
		}
	});

	// Attachment upload
	var attachment = new uploadPlus();
	
	// Submit handler
	form.on('submit(webform)', function(data){
		let callback = function (e) {
			layer.msg(e.msg);
			if (e.code == 0) {
				tool.sideClose(1000);				
			}
		}
		if(!data.field.status){
			layer.msg('Please select asset status');
			return false;
		}
		if(!data.field.source){
			layer.msg('Please select asset source');
			return false;
		}
		let clickbtn = $(this);
		tool.post("/adm/property/add", data.field, callback,clickbtn);
		return false;
	});
}
</script>
{/block}
<!-- /Script -->