<?php $__env->startSection('css_page_level'); ?>  
    <link rel="stylesheet" type="text/css" href="<?php echo e(asset('assets/global/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css')); ?>" />
    <link rel="stylesheet" type="text/css" href="<?php echo e(asset('assets/global/plugins/bootstrap-daterangepicker/daterangepicker.min.css')); ?>" />
    <link rel="stylesheet" type="text/css" href="<?php echo e(asset('assets/global/plugins/bootstrap-select/bootstrap-select.min.css')); ?>"/>
    <link rel="stylesheet" type="text/css" href="<?php echo e(asset('assets/global/plugins/select2/css/select2.css')); ?>"/>
    <link rel="stylesheet" type="text/css" href="<?php echo e(asset('assets/global/plugins/select2/css/select2-bootstrap.min.css')); ?>"/>
    <link rel="stylesheet" type="text/css" href="<?php echo e(asset('assets/global/plugins/jquery-multi-select/css/multi-select.css')); ?>"/>
    <link rel="stylesheet" type="text/css" href="<?php echo e(asset('assets/global/plugins/bootstrap-fileinput/bootstrap-fileinput.css')); ?>"/>
	
		<style type="text/css">
		.th_display_none { display: none;}
        .disableInput {
            background-color: #ffee88 !important;
        }
        .readOnlyInput {
            background-color: #ffee88 !important;
        }
	</style>
<?php $__env->stopSection(); ?>

	
<?php $__env->startSection('page-content-wrapper'); ?>
	<div class="page-content-wrapper" id="main">
		<div class="page-content">
			<!-- BEGIN PAGE HEADER-->
			<h3 class="page-title">
			<?php $setting = app('anlutro\LaravelSettings\Facade'); ?>
			<?php echo e($setting::get('system_name','全方位建築智慧化管理系統')); ?> <small><?php echo e($setting::get('company_name','新保科技')); ?></small>
			</h3>
			<div class="page-bar">
				<ul class="page-breadcrumb">
					<li>
						<i class="fa fa-home"></i>
						<a href="<?php echo e(route('manage::index')); ?>">首頁</a>
						<i class="fa fa-angle-right"></i>
					</li>
					<li>
						<a href="javascript:;">設備管理</a>
						<i class="fa fa-angle-right"></i>
					</li>
					<li>
						<a href="<?php echo e(action('InstEquipmentController@index')); ?>">設備登陸</a>
						<i class="fa fa-angle-right"></i>
					</li>
					<li>
						<a href="<?php echo e(action('InstEquipmentController@create')); ?>">新增設備</a>
					</li>
				</ul>
				<div class="page-toolbar">

				</div>
			</div>
			<!-- END PAGE HEADER-->
			<!-- BEGIN DASHBOARD STATS -->
			<div class="row">
				<div class="col-md-12">
					<!-- BEGIN PORTLET-->
					<?php if(count($errors) > 0): ?>
						<div id="form_error_alert" class="alert alert-danger">
						<button class="close" data-close="alert"></button>
							<ul>
					            <?php foreach($errors->all() as $error): ?>
					                <li><?php echo e($error); ?></li>
					            <?php endforeach; ?>
					        </ul>
						</div>
					<?php endif; ?>
					<div id="form_add_equipment_error" class="alert alert-danger display-hide">
						<button class="close" data-close="alert"></button>
						您似乎有部分欄位有錯誤，請查看後再送出。
					</div>
					<div class="portlet box purple-studio">
						<div class="portlet-title">
							<div class="caption">
								<i class="fa fa-album"></i>新增設備
							</div>
						</div>
						<div class="portlet-body form">
							<form action="<?php echo e(action('InstEquipmentController@store')); ?>" method="POST" id="form_add_equipment" class="form-horizontal form-bordered"  enctype="multipart/form-data">

								<input type="hidden" name="_token" value="<?php echo e(csrf_token()); ?>">
								
								<div class="form-group">
									<label class="col-md-3 control-label">設備名稱<span class="required" aria-required="true"> * </span></label>
									<div class="col-md-6">
										<div class="input-icon">
											<i class="fa fa-pencil"></i>
											<input name="equipment_name" type="text" class="form-control" placeholder="請輸入設備名稱">
										</div>
									</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label">財產編號<span class="required" aria-required="true"> * </span></label>
									<div class="col-md-6">
										<div class="input-icon">
											<i class="fa fa-pencil"></i>
											<input name="equipment_no" type="text" class="form-control" placeholder="請輸入財產編號">
										</div>
									</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label">保管人<span class="required" aria-required="true"> * </span></label>
										<div class="col-md-6">
											<select name="custodian" class="form-control select2me" id="set" data-placeholder="請選擇保管人員">
												<option value=""></option>
												<?php $__empty_1 = true; foreach($users as $one): $__empty_1 = false; ?>
													<option value="<?php echo $one->id; ?>"><?php echo $one->name; ?></option>
												<?php endforeach; if ($__empty_1): ?>
													<option value="">尚未設定相關保管人員</option>
												<?php endif; ?>
											</select>
										</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label">取得日期<span class="required" aria-required="true"> * </span></label>
										<div class="col-md-6">
											<div class="input-group date date-picker" data-date-format="yyyy-mm-dd">
												<input type="text" name="purchase_date" readonly class="form-control"> 
												<span class="input-group-btn">
													<button class="btn default date-set" type="button"><i class="fa fa-calendar"></i></button>
												</span>
											</div>  
										</div>  
               					 </div>
								<div class="form-group">
            						<label class="col-md-3 control-label">取得成本<span class="required" aria-required="true"> * </span></label>
										<div class="col-md-6">
											<div class="input-icon">
              						            <i class="fa fa-pencil"></i>
												<input type="text" name="costs" class="form-control" placeholder="請輸入成本">
											</div>
										</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label">保固年限<span class="required" aria-required="true"> * </span></label>
										<div class="col-md-6">
											<div class="input-icon">
                						        <i class="fa fa-pencil"></i>
												<input type="text" name="age_limit" class="form-control" placeholder="請輸入年限">   
											</div>
										</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label">現值</label>
										<div class="col-md-6">
											<input type="text" name="depreciation_price" class="form-control readOnlyInput" value="0">   
										</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label">放置位置<span class="required" aria-required="true"> * </span></label>
									<div class="col-md-6">
										<select name="placement" class="form-control select2me" data-placeholder="請選擇設備放置位置">
											<option value=""></option>
											<?php foreach($placements as $tag): ?>
											<option value="<?php echo e($tag); ?>"><?php echo e($tag); ?></option>
											<?php endforeach; ?>
										</select>
									</div>
								</div>
								<div class="form-group">
										<label class="col-md-3 control-label">設備規格</label>
										<div class="col-md-6">
											<div class="input-icon">
												<i class="fa fa-pencil"></i>
													<textarea name="specification" class="form-control" rows="3" placeholder="請輸入設備規格"></textarea>
											</div>
										</div>
								</div>
                                <div class="form-group cover">
									<label class="col-md-3 control-label">設備照片</label>
									<div class="col-md-4">
										<div class="fileinput fileinput-new" data-provides="fileinput">
											<div class="fileinput-preview thumbnail" data-trigger="fileinput" style="width: 200px; height: 150px;">
												<img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&amp;text=no+image" alt=""/>
											</div>
											<div>
												<span class="btn default btn-file">
												<span class="fileinput-new">
												選擇圖片 </span>
												<span class="fileinput-exists">
												更換 </span>
												<input type="file" name="cover_img" id="cover_img">
												</span>
												<a href="javascript:;" id="cover_reset" class="btn red fileinput-exists" data-dismiss="fileinput">
												移除 </a>
											</div>
										</div>
									</div>
								</div>
								<input type="hidden" id="status" name="status" value="0">
								<input type="hidden" id="_token" name="_token" value="<?php echo e(csrf_token()); ?>">
								<div class="form-actions">
									<div class="row">
										<div class="col-md-offset-3 col-md-9">
											<button type="submit" class="btn purple pull-right"><i class="fa fa-check"></i> 送出 </button>
										</div>
									</div>
								</div>
							</form>
						</div>
					</div>
					<!-- END PORTLET-->
				</div>
			</div>
		</div>
	</div>
<?php $__env->stopSection(); ?>

<?php $__env->startSection('plugins_page_level'); ?>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/jquery-validation/js/jquery.validate.min.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/jquery-validation/js/additional-methods.min.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/moment.min.js')); ?>"></script>
	<script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/bootstrap-daterangepicker/moment.min.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/bootstrap-daterangepicker/daterangepicker.min.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/bootbox/bootbox.min.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/jquery-multi-select/js/jquery.multi-select.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/select2/js/select2.min.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/bootstrap-fileinput/bootstrap-fileinput.js')); ?>"></script>
    <script type="text/javascript" src="<?php echo e(asset('assets/global/plugins/jquery-form/jquery.form.min.js')); ?>"></script>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('js_page_level'); ?>
<script>
$(document).ready(function(){
	
		$('.readOnlyInput').prop('readonly', true);
		
        $('[name="costs"]').change(function() {
            refreshDepreciationPrice($(this).parents('form'));    
        });
        $('[name="age_limit"]').change(function() {
            refreshDepreciationPrice($(this).parents('form'));    
        });
        $('[name="purchase_date"]').change(function() {
            refreshDepreciationPrice($(this).parents('form'));    
        });
        $('.date-picker').datepicker({
            orientation: "left",
            autoclose: true,
            dateFormat: 'yyyy-mm-dd'
        });
		
	//驗證送出表單
	$('#form_add_equipment').validate({
		errorElement: 'span', //default input error message container
        errorClass: 'help-block help-block-error', // default input error message class
        focusInvalid: false, // do not focus the last invalid input
        ignore: "",  // validate all fields including form hidden input
		rules:{
                    equipment_name:{
                        required:true,
                        maxlength:50
                    },     
                    accessories:{
                        required:true
                    },            
                    purchase_date:{
                        required:true,
                        date:true
                    },           
                    age_limit:{
                        required:true,
                        number:true
                    },           
                    costs:{
                        required:true,
                        number:true
                    },               
                    depreciation_price:{
                        required:true,
                        number:true
                    },         
                    custodian:{
                        required:true
                    },           
                    placement:{
                        required:true
                    },                  
                    repairer_tel:{
                        required:true,
                        maxlength:15
                    },    
                    repairer_contact:{
                        required:true,
                        maxlength:20
                    },
					cover_img:{
						extension:"jpg|gif",
					}
                },
                messages:{
                    equipment_name:{
                        required:'設備名稱不可為空',
                        maxlength:'設備名稱長度不能超過50個字元'
                    },      
                    accessories:{
                        required:'設備配件不可為空'
                    },             
                    purchase_date:{
                        required:'取得日期未輸入',
                        date:'取得日期必需是日期格式'
                    },            
                    age_limit:{
                        required:'保固年限不可為空',
                        number:'保固年限必需為數字格式'
                    },           
                    costs:{
                        required:'取得成本不可為空',
                        number:'取得成本必需為數字格式'
                    },               
                    depreciation_price:{
                        required:'現值不可為空',
                        number:'現值必需為數字格式',
                    },          
                    custodian:{
                        required:'保管人未輸入'
                    },           
                    placement:{
                        required:'放置位置未選擇'
                    },                   
                    repairer_tel:{
                        required:'維修廠商電話不可為空',
                        maxlength:'維修廠商電話長度不能超過15個字元'
                    },    
                    repairer_contact:{
                        required:'連絡人不可為空',
                        maxlength:'連絡人長度不能超過20個字元'
                    },
					cover_img:{
						extension: '請使用正確格式 jpg / gif上傳'
					}
                },

        invalidHandler: function (event, validator) { //display error alert on form submit   
            $('#form_add_equipment_success').hide();
            $('#form_add_equipment_error').show();
            $('.modal').scrollTop($('#form_add_equipment_error'));
        },

        highlight: function (element) { // hightlight error inputs
           $(element)
                .closest('.form-group').addClass('has-error'); // set error class to the control group
        },

        unhighlight: function (element) { // revert the change done by hightlight
            $(element)
                .closest('.form-group').removeClass('has-error'); // set error class to the control group
        },

        success: function (label) {
            label
                .closest('.form-group').removeClass('has-error'); // set success class to the control group
        },

        submitHandler: function (form) {
			$('textarea.ckeditor').each(function () {
			   var $textarea = $(this);
			   $textarea.val(CKEDITOR.instances[$textarea.attr('name')].getData());
			});

			form.submit();
        },
		
        errorPlacement: function(error, element) {
        	if (element.attr("name") === "cover_img") {
    			error.appendTo( element.parent().parent() );
 
    		} else {
    			error.insertAfter( element );
       		}
		},
	});

	$('.fileinput').on('change.bs.fileinput', function() {
			$("#form_add_equipment").validate().element('input[name=cover_img]');
	});
	
	var refreshDepreciationPrice = function(form)
        {
            var price        = 0; 
            var purchaseDate = $('[name="purchase_date"]', form).val();
            var costs        = $('[name="costs"]', form).val();
            var ageLimit     = $('[name="age_limit"]', form).val();
            var today        = new Date();
            var lastDate;
            
            try {
                purchaseDate = purchaseDate.split("-");
                
                lastDate     = new Date(parseInt(purchaseDate[0]) + parseInt(ageLimit), purchaseDate[1] - 1, purchaseDate[2]);
                purchaseDate = new Date(purchaseDate[0], purchaseDate[1] - 1, purchaseDate[2]);
                
                if (today < lastDate) {
                    price = costs / ((lastDate - purchaseDate) / (24 * 60 * 60 * 1000));
                    price = (lastDate - today) / (24 * 60 * 60 * 1000) * price;
                }
               
                $('[name="depreciation_price"]', form).val(Math.ceil(price));
                
            } catch(e) {
                
            }
        }
});

</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layout.manage', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>