@extends('layouts.app')
@section('style')
    <link href="{{url('css/custome-table.css')}}" rel="stylesheet">
    <link href="{{url('/assets/bootstrap-colorpicker/css/colorpicker.css')}}" rel="stylesheet" type="text/css" />
    <link href="{{url('/assets/jquery-minicolors/jquery.minicolors.css')}}" rel="stylesheet" type="text/css" />
    <link href="{{url('/assets/bootstrap-wysihtml5/bootstrap-wysihtml5.css')}}" rel="stylesheet" type="text/css" />
    <style type="text/css">
        .v-select .selected-tag{
            height: -2px !important;
        }
        .v-select.searchable .dropdown-toggle{
            height: 27px;
            /* border: 1px solid red; */
        }
    </style>
@stop
@section('content')
@include('inventories.cmodal')
    <div class="row" id="app" v-cloak>
        <div class="portlet light bg-inverse">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-equalizer font-green-haze"></i>
                    @if($type == 'create_new')
                    <span class="caption-subject font-green-haze bold uppercase">@lang('layout.CreateNewPorject')</span>
                    @else 
                    <span class="caption-subject font-green-haze bold uppercase">@lang('layout.UpdateProject')</span>
                    @endif
                    {{--<span class="caption-helper">some info...</span>--}}
                </div>
                <div class="tools">
                    <a href="" class="collapse"> </a>
                    <a href="#portlet-config" data-toggle="modal" class="config"> </a>
                    <a href="" class="reload"> </a>
                    <a href="" class="remove"> </a>
                </div> 
            </div> 
            <ul class="nav nav-tabs" role="tablist">
                <li class="nav-item active">
                    <a class="nav-link active" data-toggle="tab" href="#home">@lang('layout.Project')</a>
                </li>
                {{-- <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#home2">@lang('layout.ProjectDetails')</a>
                </li> --}}
            </ul>                
            <div class="portlet-body form" id="item-service">
                @if($type == 'create_new')
                {!! Form::model($projects, ['method' => 'POST','class'=>'form-horizontal','route' => ['project.store']]) !!}
                @else 
                {!! Form::model($projects, ['method' => 'PATCH','route' => ['project.update',$projects->id],'class'=>'form-horizont','id'=>'project-form','files'=> true]) !!}
                @endif
                <div class="tab-content"> 
                    <input type="hidden" name="project_id" value="{{$projects->id}}">
                    <input type="hidden" name="add_new" value="{{$type}}">
                    <div class="tab-pane active" id="home">
                        <div class="row" style="padding: 15px;">
                            <div class="col-lg-10 col-md-10 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <div class="col-md-2">
                                    <label class="control-label ">@lang('layout.ProjectName')</label>
                                    {{Form::text('name',null,['class' => 'form-control','placeholder' => __('layout.ContractName')])}}
                                </div>
                                <div class="col-md-2">
                                    <label class="control-label">@lang('layout.ProjectCode')</label>
                                    {{Form::text('number',null,['class' => 'form-control'])}}
                                </div>
                                <div class="col-md-2">
                                    <label class="control-label ">@lang('layout.Price')</label>
                                    @if($type == 'create_new')
                                    <input type="number" name="project_price" class="form-control" placeholder="{{__('layout.Price')}}" step="any">
                                    @else 
                                    {{Form::number('project_price',null,['class' => 'form-control','placeholder' => __('layout.Price'), 'step'=>'any' ])}}
                                    @endif
                                </div>
                                <div class="col-md-2">
                                    <label class="control-label ">@lang('layout.InitialPrice')</label>
                                    {{Form::number('initial_price',null,['class' => 'form-control','placeholder' => __('layout.InitialPrice'), 'step'=>'any' ])}}
                                </div>
                                <div class="col-lg-2 col-md-2 col-sm-12 col-xs-12">
                                    <div class="form-group"> 
                                        <div class="col-md-12">
                                            <label class="control-label">@lang('layout.Discount')</label> 
                                            <div class="input-group" :class="{'has-error':discount<0 || discount>100 }">
                                                <input  v-model="discountFiled" class="form-control" type="number" min="0" max="100"> 
                                                <span  v-if="discountIsAmount"  @click="discountIsAmount = !discountIsAmount" class="input-group-addon">@{{selected_currency.symbol}} 
                                                    <input type="hidden" name="discount_type" value="currency">
                                                </span>
                                                <span  v-else @click="discountIsAmount = !discountIsAmount" class="input-group-addon" >%
                                                    <input type="hidden" name="discount_type" value="percent">
                                                </span>
                                                <input type="hidden" name="discountTotal" :value="discount">
                                                <input type="hidden" name="discount" :value="discountFiled">
                                            </div>
                                        </div>
                                    </div> 
                                </div>
                                <div class="col-md-3" style="height: 53px;">
                                    <label class="control-label">@lang('layout.Currency')</label> 
                                    <v-select label="code" @input="selectedRate" :options="currency" v-model="selected_currency"></v-select>
                                    <input type="hidden" name="currency" :value="selected_currency.code">
                                </div> 
                                <div class="col-md-2">
                                    <label class="control-label">@lang('layout.Rate')</label>
                                    <div class="input-group">
                                        <input  v-model="selected_currency.exchange_rate" class="form-control" type="number" min="0" step="any" >
                                        <span class="input-group-addon" style="background-color: rgb(80, 129, 141); color: white;">@{{selected_currency.symbol}}</span>
                                    </div>
                                    <input type="hidden" name="currency_rate" :value="selected_currency.exchange_rate">
                                </div>
                                <div class="col-md-3" style="height: 53px;">
                                    <label class="control-label">@lang('layout.SelectCustomer')</label>
                                    <v-select label="name" @search="MemberSearch" :options="customer" v-model="selectedMember"></v-select>
                                    <input type="hidden" name="customer_id" v-validate="'required'" data-vv-as="@lang('layout.Customer')" :value="!selectedMember?null:selectedMember.id" required>
                                    <span class="required">@{{ errors.first('customer_id') }}</span>
                                </div>
                                <div class="col-md-2">
                                    <label class="control-label">@lang('layout.MaintainanceDuration')</label>
                                    <input type="number" class="form-control" name="maintainance_duration" placeholder ="@lang('layout.MaintainanceDuration')" value="{{$projects->maintainance_duration}}">
                                </div> 
                                <div class="col-md-2">
                                    <label class="control-label">@lang('layout.WorkCode')</label>
                                    <input type="number" class="form-control" name="work_code" value="{{$projects->work_code}}" placeholder="@lang('layout.WorkCode')">
                                </div>
                                <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" style="height: 53px;">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            <label class="control-label">@lang('layout.IncomeAccount')</label>
                                            <v-select  label="name"  :options="income" v-model="selected_income"></v-select>
                                            <input type="hidden" name="income_account" :value="(!selected_income)?null:selected_income.id">    
                                        </div>
                                    </div> 
                                </div>
                                <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" style="height: 53px;">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            <label class="control-label">@lang('layout.UnitCostAccount')</label>
                                            <v-select placeholder="@lang('layout.UnitCostAccount')" tabindex = "5" label="name"  :options="{{ json_encode($Expense) }}" v-model="expenseAccount" ></v-select>
                                            <input type="hidden" name="expense_account" v-validate="'required'" data-vv-as="@lang('layout.UnitCostAccount')" :value="(expenseAccount)?expenseAccount.id:null">
                                            <span class="required">@{{ errors.first('expense_account') }}</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" style="height: 53px;">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            <label class="control-label">@lang('layout.AssetAccount')</label>
                                            <v-select placeholder="@lang('layout.SelectAssetAccount')" tabindex = "6" label="name"  :options="{{ json_encode($asset) }}" v-model="assetAccount" ></v-select>
                                            <input type="hidden" name="asset_account" v-validate="'required'" data-vv-as="@lang('layout.AssetAccount')" :value="(assetAccount)?assetAccount.id:null">
                                            <span class="required">@{{ errors.first('asset_account') }}</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            <label class="control-label">@lang('layout.Description')</label>
                                            <textarea  name="description" class="form-control" rows="1">{{$projects->description}}</textarea>
                                        </div>
                                    </div> 
                                </div>
                                <div class="col-md-2">
                                    <label class="control-label">@lang('layout.StartDate')</label>
                                    <input type="text" id="getdate" class="form-control date" autocomplete="off" name="start_date" value="{{$projects->start_date}}">
                                </div>
                                <div class="col-md-2">
                                    <label class="control-label">@lang('layout.EndDate')</label>
                                    <input type="text" id="dueDate" class="form-control date" autocomplete="off" name="end_date" value="{{$projects->end_date}}">
                                </div>
                                <div class="col-md-2">
                                    <label class="control-label">@lang('layout.Percentage')</label>
                                    <input type="number" step="any" class="form-control" name="percent" value="{{$projects->percentage}}" />
                                </div>
                                <div class="col-md-2" style="text-align: center;">
                                    <label class=" control-label">@lang('layout.MoreOption')</label>
                                    <div class="col-md-12 mt-checkbox">
                                        <label class="mt-checkbox mt-checkbox-outline">
                                            <input type="checkbox" name="MoreOptionstatus" v-model="MoreOptionstatus" value="MoreOption">
                                            <span></span>
                                        </label>
                                    </div>
                                </div>
                                <div class="col-md-2" style="text-align: center;">
                                    <label class=" control-label">@lang('layout.Volunteering')</label>
                                    <div class="col-md-12 mt-checkbox">
                                        <label class="mt-checkbox mt-checkbox-outline">
                                            <input type="checkbox" name="status" v-model="status" value="volunteering">
                                            <span></span>
                                        </label>
                                    </div>
                                </div>
                                <div class="col-md-2">
                                    <label class="control-label">@lang('layout.PrintingHouse')</label>
                                    <div class="col-md-12 mt-checkbox">
                                        <label class="mt-checkbox mt-checkbox-outline">
                                            <input type="checkbox" name="printingHouse" v-model="printingHouse" value="printingHouse">
                                            <span></span>
                                        </label>
                                    </div>
                                </div>
                                <div class="col-md-3" v-show="MoreOptionstatus">
                                    <label class="control-label">@lang('layout.Location')</label>
                                    <input type="text" name="location" class="form-control" value="{{$projects->location}}" placeholder="@lang('layout.Location')">
                                </div>
                                <div class="col-md-3" style="margin:0px;" v-show="MoreOptionstatus">
                                    <label class="control-label">@lang('layout.Province')</label>
                                    <input value="{{$projects->province}}" type="text" name="province" class="form-control" placeholder="@lang('layout.Province')">  
                                </div>
                                <div class="col-md-3" v-show="MoreOptionstatus">
                                    <label class="control-label">@lang('layout.District')</label>
                                    <input type="text" name="district" class="form-control" value="{{$projects->district}}" placeholder="@lang('layout.District')">
                                </div>
                                <div class="col-md-3" v-show="MoreOptionstatus">
                                    <label class="control-label">@lang('layout.Color')</label>
                                    <input type="text" id="saturation-demo" class="form-control demo" data-control="saturation" name="color" value="{{$projects->color}}"> 
                                </div>
                                <div class="col-md-3" v-show="MoreOptionstatus" style="height: 53px;">
                                    <label class="control-label">@lang('layout.ProjectProgress')</label>
                                    <v-select class="vue-select2" v-model="selectedProgress" label="name"
                                    :options="{{$project_progress}}">
                                    </v-select>
                                    <input type="hidden" name="project_progress_id" v-model.number="(!selectedProgress)?null:selectedProgress.id">
                                </div>
                                <div class="col-md-3" v-show="MoreOptionstatus" style="height: 53px;">
                                    <label class="control-label">@lang('layout.Type')</label>
                                    <v-select class="vue-select2" v-model="selectedCategory" label="name" :options="{{$projectCategory}}"></v-select>
                                    <input type="hidden" name="project_category_id" v-model.number="(!selectedCategory)?null:selectedCategory.id">
                                </div>
                                <div class="col-md-3" v-show="MoreOptionstatus" style="height: 53px;">
                                    <label class="control-label">@lang('layout.WorkType')</label>
                                    <v-select class="vue-select2" v-model="selectedWorkType" label="name" :options="{{$work_types}}"></v-select>
                                    <input type="hidden" name="work_type_id" v-model.number="(!selectedWorkType)?null:selectedWorkType.id">
                                </div> 
                                <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" v-show="MoreOptionstatus">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            <label class="control-label">@lang('layout.Memo')</label>
                                            <textarea name="memo" class="form-control" rows="1">{{$projects->memo}}</textarea>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.PageQuantity')</label>
                                    <input type="text" name="page_count" class="form-control" value="{{$projects->page_count}}" placeholder="@lang('layout.PageQuantity')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.Circulation')</label>
                                    <input type="text" name="circulation" class="form-control" value="{{$projects->circulation}}" placeholder="@lang('layout.Circulation')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.Size')</label>
                                    <input type="text" name="size" class="form-control" value="{{$projects->size}}" placeholder="@lang('layout.Size')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.ColorCount')</label>
                                    <input type="text" name="color_count" class="form-control" value="{{$projects->color_count}}" placeholder="@lang('layout.ColorCount')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.Print')</label>
                                    <input type="text" name="print" class="form-control" value="{{$projects->print}}" placeholder="@lang('layout.Print')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.BindingType')</label>
                                    <input type="text" name="binding_type" class="form-control" value="{{$projects->binding_type}}" placeholder="@lang('layout.BindingType')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.FormCount')</label>
                                    <input type="text" name="form_count" class="form-control" value="{{$projects->form_count}}" placeholder="@lang('layout.FormCount')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.Explanation')</label>
                                    <input type="text" name="explanation" class="form-control" value="{{$projects->explanation}}" placeholder="@lang('layout.Explanation')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.PaperTypeAndGrammage')</label>
                                    <input type="text" name="paper_type_and_grammage" class="form-control" value="{{$projects->paper_type_and_grammage}}" placeholder="@lang('layout.PaperTypeAndGrammage')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.CoverPaperTypeAndGrammage')</label>
                                    <input type="text" name="cover_paper_type_and_grammage" class="form-control" value="{{$projects->cover_paper_type_and_grammage}}" placeholder="@lang('layout.CoverPaperTypeAndGrammage')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.EndpaperTypeAndGrammage')</label>
                                    <input type="text" name="endpaper_type_and_grammage" class="form-control" value="{{$projects->endpaper_type_and_grammage}}" placeholder="@lang('layout.EndpaperTypeAndGrammage')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.CoatingPaperAndGrammage')</label>
                                    <input type="text" name="coating_paper_and_grammage" class="form-control" value="{{$projects->coating_paper_and_grammage}}" placeholder="@lang('layout.CoatingPaperAndGrammage')">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.CTP')</label>
                                    <v-select label="name" @search="VendorSearch" :options="vendor" v-model="selectedVendor1"></v-select>
                                    <input type="hidden" name="vendor_id_one" :value="!selectedVendor1?null:selectedVendor1.id">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.CoworkerPrinting')</label>
                                    <v-select label="name" @search="VendorSearch" :options="vendor" v-model="selectedVendor2"></v-select>
                                    <input type="hidden" name="vendor_id_two" :value="!selectedVendor2?null:selectedVendor2.id">
                                </div>
                                <div class="col-md-3" v-show="printingHouse">
                                    <label class="control-label">@lang('layout.PaperSeller')</label>
                                    <v-select label="name" @search="VendorSearch" :options="vendor" v-model="selectedVendor3"></v-select>
                                    <input type="hidden" name="vendor_id_three" :value="!selectedVendor3?null:selectedVendor3.id">
                                </div>
                            </div>
                            <div class="col-lg-2 col-md-2 col-sm-12 col-xs-12" >
                                <div style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px;margin-bottom: 1em;background: transparent !important;padding-bottom: 1px;">
                                    <div class="dashboard-stat2 ">
                                        <table class="dashboard-tabel" width="100%" border="1">
                                            <tr>
                                                <td class="text-center">
                                                    <small>@lang('layout.Total')</small>
                                                </td>
                                                <td class="text-center">
                                                    <span data-counter="counterup"  data-value="7800">@{{ Number.parseFloat((subtotal - (discount*subtotal/100))).toFixed(2)}}</span>
                                                    <small class="font-green-sharp">@{{selectedCurrency.symbol}}</small>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="text-center">
                                                    <small>@lang('layout.Discount'): (@{{ Number.parseFloat(discount).toFixed(2) }}%)</small>
                                                </td>
                                                <td class="text-center">
                                                    <span class="text-right" data-counter="counterup" data-value="7800">@{{ Number.parseFloat(discount*subtotal/100).toFixed(2) }}</span>
                                                    <small class="font-green-sharp">@{{selectedCurrency.symbol}}</small>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="text-center">
                                                    <small>@lang('layout.Sub-Total')</small>
                                                </td>
                                                <td class="text-center">
                                                    <span class="text-right" data-counter="counterup" data-value="7800">@{{ subtotal.toFixed(2)}}</span>
                                                    <small class="font-green-sharp">@{{selectedCurrency.symbol}}  </small>
                                                    <input type="hidden" :value="subtotal" name="totalAmountss">
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row" style="padding: 0px 15px;" v-show="status">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <h4>
                                    @lang('layout.Volunteeres') 
                                </h4>
                                <div class="col-md-3" style="margin-bottom: 10px;">
                                    <label class="control-label">@lang('layout.Agent')</label>
                                    <v-select class="vue-select2" v-model="selectedEmployee" label="name" @search="EmployeeSearch" :options="employee" placeholder="@lang('layout.Agent')" >
                                    </v-select>
                                    <input type="hidden" name="employee_id" v-model.number="(!selectedEmployee)?null:selectedEmployee.id">
                                </div>
                                <div class="col-md-3" style="margin-bottom: 10px;">
                                    <label class="control-label ">@lang('layout.GranteeAmount')</label>
                                    {{Form::number('grantee_amount',null,['class' => 'form-control','placeholder' => __('layout.GranteeAmount'), 'step'=>'any' ])}}
                                </div>
                                <div class="col-md-3" style="margin-bottom: 10px;">
                                    <label class="control-label">@lang('layout.VolunteeringDate')</label>
                                    <input type="text" class="form-control date" name="volunteering_date" value="{{$projects->volunteering_date}}" autocomplete="off">
                                </div>
                                <div class="col-md-3" style="margin-bottom: 10px;">
                                    <label class="control-label">@lang('layout.Times') @lang('layout.Volunteeres')</label>
                                    <input type="text" name="volunteeres" value="{{$projects->volunteeres}}" class="form-control">
                                </div>
                                <!-- begin volunteeres -->
                                <table id="table_content" class="table table-striped table-bordered table-advance table-hover">
                                    <thead>
                                        <tr>
                                            <th class="text-center" style="min-width: 8px;"> #</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Name')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Price')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Discount')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Type')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Description')</th>
                                            <th></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(record,index) in volunteeres">
                                            <td>@{{index+1}}</td>
                                            <td>
                                                <input class="form-control" type="text" name="vol_name[]" @click="addNew('volunteeres',index)" @input="addNew('volunteeres',index)" v-model="record.name" placeholder="@lang('layout.Name')">
                                            </td>
                                            <td>
                                                <input class="form-control" type="number" name="vol_price[]" v-model.number="record.price" placeholder="@lang('layout.Price')">
                                            </td>
                                            <td>
                                                <input class="form-control" type="number" name="vol_discount[]" v-model.number="record.discount" placeholder="@lang('layout.Discount')">
                                            </td>
                                            <td>
                                                <select name="vol_type[]" v-model="record.type" class="form-control">
                                                    <option value="Simple">@lang('layout.Simple')</option>
                                                    <option value="Assessment">@lang('layout.Assessment')</option>
                                                    <option value="Offer">@lang('layout.Offer')</option>
                                                </select>
                                            </td>
                                            <td>
                                                <input class="form-control" type="text" name="vol_description[]" v-model="record.description" placeholder="@lang('layout.Description')">
                                            </td>
                                            <td>
                                                <span v-if="volunteeres.length > 1" v-on:click="deleteItem('volunteeres',index)"><i class="paddint-both glyphicon glyphicon-trash"></i></span>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                                <!-- end volunteeres -->
                            </div>
                        </div>
                        <div class="row" style="padding: 0px 15px;">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <div v-if="inventories.length >0 ">
                                    <h4> @lang('layout.StuffDetails') </h4>
                                    <div class="table-responsive333">
                                        <table id="table_content" class="table table-bordered table-advance table-hover">
                                            <thead>
                                                <tr>
                                                    <th>#</th>
                                                    <th style="min-width: 100px">@lang('layout.Category') </th>
                                                    <th style="min-width: 100px">@lang('layout.ItemName') </th>
                                                    <th style="min-width: 100px">@lang('layout.SiteName') </th>
                                                    <th style="min-width: 100px">@lang('layout.Quantity') </th>
                                                    <th style="min-width: 100px">@lang('layout.OnHand') </th>
                                                    <th style="min-width: 100px">@lang('layout.Measure') </th>
                                                    <th style="min-width: 100px">@lang('layout.SalePrice') </th>
                                                    <th style="min-width: 100px">@lang('layout.Total') </th>
                                                    <th><i class="fa fa-ellipsis-h"></i></th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr v-for="(item,index) in inventories">
                                                    <td>@{{index+1}}</td>
                                                    <td>
                                                        <v-select label="name" v-model="item.item_category" :options="inventory_category" @click.native="addNew('inventory',index)"  @input="itemCategoryChange(index)"></v-select>
                                                        <input type="hidden" name="inventory_category_id[]" :value="(!item.item_category)?null:item.item_category.id">
                                                    </td>
                                                    <td class="highlight">
                                                        <v-select label="name" @Click.native="setIndex(index)" v-model="item.item" :options="temp_items" @search="onItemSearchProject"></v-select>
                                                        <input type="hidden" :name="'inventory_id['+index+']'" v-validate="''" data-vv-as="@lang('layout.ItemName')" :value="(!item.item)?null:item.item.item_id">
                                                        <span class="required">@{{ errors.first('inventory_id['+index+']') }}</span>
                                                    </td>
                                                    <td class="highlight">
                                                        <select v-model="(item.item==null)?null:item.item.site" class="form-control">
                                                            <option value="null">@lang('layout.Select')</option>
                                                            <span v-if="(item.item != null)">
                                                                <option v-for="site in (item.item==null)?null:item.item.site_list" :value="site">
                                                                @{{site.site_name}}
                                                                </option> 
                                                            </span>
                                                        </select>
                                                        <input type="hidden" name="inventory_site[]" :value="(item.item==null)?null:((item.item.site==null)?null:item.item.site.site_id)">
                                                    </td>
                                                    <td>
                                                        <input type="number" :name="'inventory_quantity['+index+']'" v-validate="''" data-vv-as="@lang('layout.Quantity')" v-model.number="(item.item==null)?null:item.item.quantity" class="form-control input-style input-number"  placeholder="@lang('layout.Quantity')">
                                                        <span class="required">@{{ errors.first('inventory_quantity['+index+']') }}</span>
                                                    </td>
                                                    <td>
                                                        @{{myRound((item.item==null)?null:saleItemQuantity(item.item,item.item.quantity))}}
                                                    </td>
                                                    <td class="highlight">
                                                        <select  v-model="(item.item == null)?null:item.item.measure" class="form-control" @change="measureChange(index)">
                                                            <option value="null">@lang('layout.Select')</option>
                                                            <span v-if="(item.item ==null)?false:true">
                                                                <option  v-for="measure in (item.item==null)?null:item.item.measure_list" :value="measure">
                                                                @{{measure.measure_name}}
                                                                </option> 
                                                            </span>
                                                        </select>
                                                        <input type="hidden" name="inventory_measure[]" :value="(item.item==null)?null:item.item.measure.measure_id">
                                                    </td>
                                                    <td>
                                                        <div class="input-group">
                                                            <input type="number" name="inventory_price[]"  placeholder="@lang('layout.Price')"   :value="(item.item==null)?null:saleNewRate(item.item,selected_currency.rate, null, selected_currency.static_rate)" ref="item_rate" @input="setNewRate('inventory',index)" class="form-control">
                                                            <span class="input-group-addon">
                                                            @{{selected_currency.symbol}}
                                                            </span>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="input-group">
                                                            <input type="number" class="form-control inner_input" :value="(item.item==null)?null:getItemTotals(item.item,selected_currency.rate,null,null,null,null,null,selected_currency.static_rate)" placeholder="@lang('layout.Total')" disabled>
                                                            <span class="input-group-addon" >
                                                                <b>@{{selected_currency.symbol}}</b>
                                                            </span>
                                                        </div>
                                                    </td>
                                                    <td class="text-center">
                                                        <span  v-on:click="deleteItem('inventory',index)" style="cursor: pointer;"><i class="paddint-both glyphicon glyphicon-trash"></i></span>
                                                        <!--span  @click="addNew('inventory',index)"><i class="paddint-both glyphicon glyphicon-plus"></i></span -->
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div> 
                            </div>
                        </div>
                        <div class="col-md-12" style="margin-bottom: 10px;">
                            <label class=" control-label">@lang('layout.Formula')</label>
                            <label class="mt-checkbox mt-checkbox-outline">
                                <input type="checkbox" name="Formulastatus" v-model="Formulastatus" value="volunteering">
                                <span></span>
                            </label>
                        </div>
                        <div v-show="Formulastatus" class="row" style="padding: 0px 15px;">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <div v-if="FormulaItems.length >0 ">
                                    <h4> @lang('layout.Formula') </h4>
                                    <div class="table-responsive333">
                                        <table id="table_content" class="table table-bordered table-advance table-hover">
                                            <thead>
                                                <tr> 
                                                    <th class="text-center" style="min-width: 6px;">#</th>
                                                    <th class="text-center" style="min-width: 100px;">@lang('layout.ItemName')</th>
                                                    <th class="text-center" style="min-width: 60px;"> @lang('layout.FormulaName')</th>
                                                    <th class="text-center" style="min-width: 50px;"> @lang('layout.QuantityToBuild')</th>
                                                    <th class="text-center" style="min-width: 40px;"> @lang('layout.Price')</th>
                                                    <th class="text-center" style="min-width: 60px;"> @lang('layout.Total')</th>
                                                    <th style="min-width: 20px;"><i class="fa fa-ellipsis-h"></i></th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr v-for="(Item,Index) in FormulaItems" class="even">
                                                    <td class=""> @{{Index+1}}</td>
                                                    <td class="highlight"> 
                                                        <v-select label="name" v-model="Item.selected_item" :options="items" @input="getItemFormula(Index)" @search="onItemSearch" @click.native="addNew('FormulaItems',Index)"></v-select>
                                                        <input type="hidden" name="formula_item[]" :value="(!Item.selected_item)?null:Item.selected_item.item_id">
                                                    </td> 
                                                    <td>
                                                        {{-- <select class="form-control" v-model="Item.selected_formula">
                                                            <option>@lang('layout.Select')</option>
                                                            <option v-for="formula in Item.formula_list" :value="formula">
                                                                @{{formula.code+'-'+formula.name}}
                                                            </option>
                                                        </select> --}}

                                                        <v-select label="name" v-model="Item.selected_formula" :options="(Item.formula_list)" placeholder="@lang('layout.Select')"></v-select>

                                                        <input type="hidden" name="formula_id[]" :value="(!Item.selected_formula)?null:Item.selected_formula.id">
                                                        <input type="hidden" name="formula_measure_id[]" :value="(!Item.selected_formula)?null:Item.selected_formula.um_id">
                                                    </td> 
                                                    <td>
                                                        <input type="number" name="formula_qty[]" placeholder="@lang('layout.EnterQuantityToBuild')" v-model.number="(!Item.selected_formula)?null:Item.selected_formula.build_qty" class="form-control">
                                                    </td>
                                                    <td>
                                                        <div class="input-group input_style"> 
                                                            @if(systemConfig()[30] == 1)
                                                            <input type="number" name="formula_cost[]" :value="(!Item.selected_formula)?null:(Item.selected_formula.cost * ((selected_currency)?selected_currency.static_rate / selected_currency.rate:1))" class="form-control" placeholder="@lang('layout.Price')" readonly />
                                                            <span class="input-group-addon">
                                                            <b>@{{selected_currency.symbol}}</b>
                                                            @else 
                                                            <input type="number" name="formula_cost[]" :value="(!Item.selected_formula)?null:(Item.selected_formula.cost * ((selected_currency)?selected_currency.rate:1))" class="form-control" placeholder="@lang('layout.Price')" readonly />
                                                            <span class="input-group-addon">
                                                                <b>@{{selected_currency.symbol}}</b>
                                                                @endif 
                                                            </span>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="input-group input_style">
                                                            @if(systemConfig()[30] == 1)
                                                            <input type="number" class="form-control inner_input" :value="(((!Item.selected_formula)?null:Item.selected_formula.cost) * ((selected_currency)?selected_currency.static_rate / selected_currency.rate:1)) * ((!Item.selected_formula)?null:Item.selected_formula.build_qty)"  placeholder="@lang('layout.Total')" 
                                                            disabled>
                                                            @else 
                                                            <input type="number" class="form-control inner_input" :value="(((!Item.selected_formula)?null:Item.selected_formula.cost) * ((selected_currency)?selected_currency.rate:1)) * ((!Item.selected_formula)?null:Item.selected_formula.build_qty)"  placeholder="@lang('layout.Total')" 
                                                            disabled>
                                                            @endif
                                                            <span class="input-group-addon">
                                                                <b>@{{selected_currency.symbol}}</b>
                                                            </span>
                                                        </div> 
                                                    </td>
                                                    <td class="text-center">
                                                        <span v-on:click="deleteItem('FormulaItems',Index)" style="cursor: pointer;"><i class="paddint-both glyphicon glyphicon-trash"></i></span>
                                                    </td>
                                                </tr> 
                                            </tbody>
                                        </table>
                                    </div>
                                </div> 
                            </div>
                        </div>
                        <div class="col-md-12" style="margin-bottom: 10px;">
                            <label class=" control-label">@lang('menu.BuildWithoutFormula')</label>
                            <label class="mt-checkbox mt-checkbox-outline">
                                <input type="checkbox" name="BuildWithoutFormulastatus" v-model="BuildWithoutFormulastatus" value="volunteering">
                                <span></span>
                            </label>
                        </div>
                        <div class="row" style="padding: 0px 15px;" v-show="BuildWithoutFormulastatus">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <div v-if="productions.length >0 ">
                                    <h4> @lang('menu.BuildWithoutFormula') </h4>
                                    <div class="table-responsive333">
                                        <table id="table_content" class="table table-bordered table-advance table-hover">
                                            <thead>
                                                <tr> 
                                                    <th class="text-center" style="min-width: 6px;">#</th>
                                                    <th class="text-center" style="min-width: 100px;">@lang('layout.ItemName')</th>
                                                    <th class="text-center" style="min-width: 50px;"> @lang('layout.QuantityToBuild')</th>
                                                    <th class="text-center" style="min-width: 40px;"> @lang('layout.Price')</th>
                                                    <th class="text-center" style="min-width: 60px;"> @lang('layout.Total')</th>
                                                    <th style="min-width: 20px;"><i class="fa fa-ellipsis-h"></i></th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr v-for="(production,productionIndex) in productions" class="even">
                                                    <td class=""> @{{productionIndex+1}} </td>
                                                    <td class="highlight"> 
                                                        <input type="text" name="w_formula_ItemName[]" v-model.name="(!production.items)?null:production.items.name" ref="name" @input="setProduction(productionIndex)" class="form-control" @click="addNew('production',productionIndex)">
                                                    </td>
                                                    <td>
                                                        <input type="number" placeholder="@lang('layout.EnterQuantityToBuild')" name="w_formula_qty[]" ref="w_build_qty" @input="setProduction(productionIndex)" v-model.number="(!production.items)?null:production.items.w_build_qty" class="form-control">
                                                    </td> 
                                                    <td>
                                                        <div class="input-group input_style">
                                                            <input type="number" name="w_formula_price[]" class="form-control" placeholder="@lang('layout.Price')" ref="price" @input="setProduction(productionIndex)" v-model.number="(!production.items)?null:production.items.price">
                                                            <span class="input-group-addon">
                                                                <b>@{{selected_currency.symbol}}</b>
                                                            </span>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="input-group input_style">
                                                            <input type="" class="form-control inner_input"  placeholder="@lang('layout.Total')" :value="(!production.items)?0:production.items.w_build_qty * ((!production.items)?0:production.items.price)"
                                                            disabled>
                                                            <span class="input-group-addon">
                                                                <b>@{{selected_currency.symbol}}</b>
                                                            </span>
                                                        </div> 
                                                    </td>
                                                    <td class="text-center">
                                                        <span  v-on:click="deleteItem('production',productionIndex)" style="cursor: pointer;"><i class="paddint-both glyphicon glyphicon-trash"></i></span>
                                                    </td>
                                                </tr> 
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-12" style="margin-bottom: 10px;">
                            <label class=" control-label">@lang('layout.Service')</label>
                            <label class="mt-checkbox mt-checkbox-outline">
                                <input type="checkbox" name="Servicestatus" v-model="Servicestatus" value="volunteering">
                                <span></span>
                            </label>
                        </div>
                        <div class="row" style="padding: 0px 15px;" v-show="Servicestatus">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <div v-if="services.length >0 " >
                                    <h4>@lang('layout.Service')</h4>
                                    <div class="table-responsive333"> 
                                        <table id="table_content" class="table table-striped table-bordered table-advance table-hover">
                                            <thead>
                                                <tr>
                                                    <th class="text-center" style="min-width: 8px;"> # </th>
                                                    <th class="text-center" style="min-width: 160px;">@lang('layout.ServiceName')</th>
                                                    <th class="text-center" style="min-width: 160px;">@lang('layout.Quantity')</th>
                                                    <th class="text-center" style="min-width: 160px;">@lang('layout.Measure')</th>
                                                    <th class="text-center" style="min-width: 160px;">@lang('layout.Price')</th>              
                                                    <th class="text-center" style="min-width: 120px;">@lang('layout.Total')</th>
                                                    <th><i class="fa fa-ellipsis-h"></i></th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr v-for="(service,index) in services">
                                                    <td>@{{index+1}}</td>
                                                    <td class="highlight">
                                                        <v-select label="name" v-model="service.item"  :options="(service.items)" @click.native="addNew('service',index)" @input="checkExistingService(index)"></v-select>
                                                        <input type="hidden" name="service_id[]" :value="(service.item==null)?null:service.item.id">
                                                    </td>
                                                    <td>
                                                        <input class="form-control" name="service_quantity[]" v-model.number="(!service.item)?null:service.item.quantity" placeholder="@lang('layout.Quantity')">
                                                    </td>
                                                    <td class="highlight">
                                                        <select  v-model="(!service.item)?null:service.item.measure" class="form-control" @change="measureChangeservice(index)">
                                                            <option value="null">@lang('layout.Select')</option>
                                                            <span v-if="(service.item ==null)?false:true">
                                                                <option  v-for="measure in (!service.item)?null:service.item.measure_list" :value="measure">
                                                                @{{measure.measure_name}}
                                                                </option> 
                                                            </span>    
                                                        </select>
                                                        <input type="hidden" name="service_measure[]" :value="(service.item==null)?null:service.item.measure.measure_id">
                                                    </td>
                                                    <td>
                                                        <div class="input-group">
                                                            <input type="number" name="service_price[]"  placeholder="@lang('layout.Price')"   :value="(service.item==null)?null:saleNewRate(service.item,selected_currency.exchange_rate)" ref="ser" @input="setNewRate('service',index)" class="form-control">
                                                            <span class="input-group-addon">
                                                                @{{selected_currency.symbol}}
                                                            </span>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="input-group">
                                                            <input type="number" class="form-control inner_input"   :value="(service.item==null)?null:getItemTotalService(service.item,selected_currency.exchange_rate, null, selected_currency.static_rate).result" placeholder="@lang('layout.Total')" disabled>
                                                            <span class="input-group-addon" >
                                                                <b>@{{selected_currency.symbol}}</b>
                                                            </span>
                                                        </div>
                                                    </td>
                                                    <td class="text-center">
                                                        <span  v-on:click="deleteItem('service',index)" style="cursor: pointer;"><i class="paddint-both glyphicon glyphicon-trash"></i></span>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3" style="margin-bottom: 10px;">
                            <label class=" control-label">@lang('layout.Shareholder')</label>
                            <label class="mt-checkbox mt-checkbox-outline">
                                <input type="checkbox" name="shareholderstatus" v-model="shareholderstatus" value="volunteering">
                                <span></span>
                            </label>
                        </div>
                        <div class="row" style="padding: 0px 15px;" v-show="shareholderstatus">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <h4>@lang('layout.Shareholder')</h4>
                                <!-- begin shareholder -->
                                <table id="table_content" class="table table-striped table-bordered table-advance table-hover">
                                    <thead>
                                        <tr>
                                            <th class="text-center" style="min-width: 8px;"> #</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Shareholder')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Percentage')</th>
                                            <th><i class="fa fa-ellipsis-h"></i></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(record,index) in shareholderData">
                                            <td>@{{index+1}}</td>
                                            <td class="highlight">
                                                <v-select label="name" v-model="record.selected" :options="(record.shareholder_list)" @click.native="addNew('shareholder',index)" placeholder="@lang('layout.Select')"></v-select>
                                                <input type="hidden" name="shareholder_id[]" :value="(record.selected==null)?null:record.selected.id">
                                            </td>
                                            <td>
                                                <input class="form-control" type="number" name="percentage[]" v-model.number="record.percentage" placeholder="@lang('layout.Percentage')">
                                            </td>
                                            <td class="text-center">
                                                <span v-on:click="deleteItem('shareholder',index)" style="cursor: pointer;"><i class="paddint-both glyphicon glyphicon-trash"></i></span>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                                <!-- end shareholder -->
                            </div>
                        </div>
                        <div class="col-md-12" style="margin-bottom: 10px;">
                            <label class="control-label" style="margin-bottom: 10px;">@lang('layout.ProjectSteps')</label>
                            <label class="mt-checkbox mt-checkbox-outline" style="margin-bottom: 10px;">
                                <input type="checkbox" name="projectSteps" v-model="projectStepsCheckBox" value="volunteering">
                                <span></span>
                            </label>
                        </div>
                        <div class="row" style="padding: 0px 15px;" v-show="projectStepsCheckBox">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <h4>@lang('layout.ProjectSteps')</h4>
                                <!-- begin shareholder -->
                                <table id="table_content" class="table table-striped table-bordered table-advance table-hover">
                                    <thead>
                                        <tr>
                                            <th class="text-center" style="min-width: 8px;"> #</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Name')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Number')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.StartDate')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.EndDate')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Status')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Expense')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.User')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Photo')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Description')</th>
                                            <th><i class="fa fa-ellipsis-h"></i></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(pStep,index) in projectStepList">
                                            <td>@{{index+1}}</td>
                                            <td class="highlight">
                                                <v-select label="name" v-model="pStep.projectStepName" :options="(pStep.projectStep_list)" @input="setNumber(pStep)" @click.native="addNew('projectSteps',index)" placeholder="@lang('layout.Select')"></v-select>
                                                <input type="hidden" name="step_id[]" :value="(pStep.projectStepName==null)?null:pStep.projectStepName.id">
                                            </td>
                                            <td>
                                                <input class="form-control" type="number" :name="'selected_step_number['+index+']'" v-model.number="pStep.number" placeholder="@lang('layout.Number')">    
                                            </td>  
                                            <td>
                                                <date_picker v-model="pStep.start_date" :name="'selected_step_start_date['+index+']'" class="chan_length" placeholder="@lang('layout.StartDate')"></date_picker>
                                            </td>                                          
                                            <td>
                                                <date_picker v-model="pStep.end_date" :name="'selected_step_end_date['+index+']'" class="chan_length" placeholder="@lang('layout.EndDate')"></date_picker>
                                            </td>     
                                            <td>
                                                <select :name="'selected_step_status['+index+']'" v-model="pStep.selected_status" class="form-control">
                                                    <option value="pending">@lang('layout.Pending')</option>
                                                    <option value="active">@lang('layout.Active')</option>
                                                    <option value="inActive">@lang('layout.InActive')</option>
                                                    <option value="onProgress">@lang('layout.OnProgress')</option>
                                                    <option value="completedProjects">@lang('layout.CompletedProjects')</option>
                                                </select>
                                            </td> 
                                            <td>
                                                <input class="form-control" type="number" :name="'selected_expense['+index+']'" v-model.number="pStep.expense" placeholder="@lang('layout.Expense')">    
                                            </td> 
                                            <td class="highlight">
                                                <v-select label="name" v-model="pStep.select_user" :options="user" placeholder="@lang('layout.Select')"></v-select>
                                                <input type="hidden" name="selected_step_user_id[]" :value="(pStep.select_user==null)?null:pStep.select_user.id">
                                            </td>
                                            <td class="highlight">
                                                <input class="form-control" type="file" placeholder="@lang('layout.image')" :name="'selected_step_image['+index+']'">
                                                <input type="hidden" :name="'selected_step_image_old['+index+']'" :value="(pStep.image==null)?null:pStep.image">
                                            </td>
                                            <td>
                                                <input class="form-control purchase_description" v-model="pStep.description" type="text" placeholder="@lang('layout.Description')" :name="'selected_step_description['+index+']'" >
                                            </td>  
                                            <td class="text-center">
                                                <span v-on:click="deleteItem('projectSteps',index)" style="cursor: pointer;"><i class="paddint-both glyphicon glyphicon-trash"></i></span>
                                            </td>                                
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        {{-- project info part start  --}}
                        <div class="col-md-12" style="margin-bottom: 10px;">
                            <label class="control-label" style="margin-bottom: 10px;">@lang('layout.PrintInformation')</label>
                            <label class="mt-checkbox mt-checkbox-outline" style="margin-bottom: 10px;">
                                <input type="checkbox" name="printInformation" v-model="printInformationCheckbox" value="volunteering">
                                <span></span>
                            </label>
                        </div>
                        <div class="row" style="padding: 0px 15px;" v-show="printInformationCheckbox">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px; margin-bottom: 10px;padding: 15px 0px;">
                                <h4>@lang('layout.PrintInformation')</h4>
                                <table id="table_content" class="table table-striped table-bordered table-advance table-hover">
                                    <thead>
                                        <tr>
                                            <th class="text-center" style="min-width: 8px;"> #</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Issue')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Quantity')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Type')</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.Description')</th>
                                            <th><i class="fa fa-ellipsis-h"></i></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(pInfo,index) in projectInfoList">
                                            <td class="text-center">@{{index+1}}</td>
                                            <td class="highlight">
                                                <input type="text" name="project_issue[]" class="form-control" v-model="pInfo.project_issue" @click="addNew('projectInfo',index)">
                                            </td>
                                            <td class="highlight">
                                                <input type="text" name="project_quentity[]" class="form-control" v-model="pInfo.project_quentity">
                                            </td>
                                            <td class="highlight">
                                                <input type="text" name="project_type[]" class="form-control" v-model="pInfo.project_type">
                                            </td>
                                            <td class="highlight">
                                                <input type="text" name="project_description[]" class="form-control" v-model="pInfo.project_description">
                                            </td>
                                            <td class="text-center">
                                                <span v-on:click="deleteItem('projectInfo',index)" style="cursor: pointer;"><i class="paddint-both glyphicon glyphicon-trash"></i></span>
                                            </td> 
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        {{-- project info part end  --}}
                        <div class="col-md-12" style="margin-bottom: 10px;">
                            <label class="control-label" style="margin-bottom: 10px;">@lang('layout.Recevies')</label>
                            <label class="mt-checkbox mt-checkbox-outline" style="margin-bottom: 10px;">
                                <input type="checkbox" name="recevies" v-model="receviesCheckBox" value="volunteering">
                                <span></span>
                            </label>
                        </div>
                        <div class="row" style="padding: 0px 15px;" v-show="receviesCheckBox">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="box-shadow: 0px 0px 3px rgba(172, 171, 171, 0.877);border-radius: 8px;margin-bottom: 10px;padding: 15px 0px;">
                                <table id="table_content" class="table table-striped table-bordered table-advance table-hover">
                                    <thead>
                                        <tr>
                                            <th class="text-center" style="min-width: 8px;"> #</th>
                                            <th class="text-center" style="min-width: 160px;">@lang('layout.SelectBank')</th>
                                            <th class="text-center" style="min-width: 100px;"> @lang('layout.Amount')</th>
                                            <th class="text-center" style="min-width: 120px;"> @lang('layout.Rate')</th>
                                            <th class="text-center" style="min-width: 80px;">@lang('layout.Currency')</th>
                                            <th class="text-center" style="min-width: 80px;"> @lang('layout.Amount')</th>
                                            <th class="text-center" style="min-width: 120px;">@lang('layout.Total')</th>
                                            <th class="text-center" style="min-width: 120px;">@lang('layout.Description')</th>
                                            <th></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(payment,index) in payments">
                                            <td>@{{index+1}}</td>
                                            <td class="highlight">
                                                <v-select label="name" v-model="payment.item" :options="(payment.items)" @click.native="addNew('payment',index)" @input="checkExistingPayment(index)"></v-select>
                                                <input type="hidden" v-if="payment.item !=null" name="payment_id[]" :value="(payment.item==null)?null:payment.item.id">
                                            </td>
                                            <td>
                                                <span v-if="payment.item !=null">
                                                    @{{myRound(Number((payment.item==null)?null:payment.item.balance)+Number((payment.item==null)?null:payment.item.amount))}}
                                                </span>
                                            </td>
                                            <td>
                                                <input v-bind:disabled="(payment.item==null)?false:(payment.item.code =='{{getHomeCurrency()["code"]}}')" type="number" v-model.number="(payment.item==null)?null:payment.item.rate " class="form-control" placeholder="@lang('layout.Rate')" />
                                                <input v-if="payment.item !=null" type="hidden" name="payment_rate[]" v-bind:value="payment.item.rate">
                                            </td>
                                            <td>
                                                <input type="text" name="payment_currency[]" class="form-control" v-model="(payment.item==null)?null:payment.item.code" placeholder="@lang('layout.Currency')" disabled reqiured />
                                                <input v-if="payment.item !==null" type="hidden" name="payment_currency[]" v-bind:value="payment.item.code" />
                                            </td>
                                            <td>
                                                <div class="input-group">
                                                    <input type="number" class="form-control" v-model.number="(payment.item==null)?null:payment.item.amount " placeholder="@lang('layout.PayAmount')" />
                                                    <input v-if="payment.item !=null" type="hidden" name="payment_amount[]" v-bind:value="payment.item.amount">
                                                    <span class="input-group-addon">@{{(payment.item==null)?null:payment.item.code}}</span>
                                                </div>
                                            </td>
                                            <td>
                                                @{{ (payment.item==null)?null:totalPayment(payment.item,selected_currency.rate,selected_currency.hq_rate,selected_currency.static_rate).result }}
                                                @{{selected_currency.symbol}}
                                            </td>
                                            <td>
                                                <textarea class="form-control" name="receive_description[]" rows="2" placeholder="@lang('layout.Description')">@{{(payment.item==null)?null:payment.item.description}}</textarea>
                                            </td>
                                            <td>
                                                <span v-on:click="deleteItem('payment',index)" style="cursor: pointer;">
                                                    <i class="paddint-both glyphicon glyphicon-trash"></i>
                                                </span>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="col-xs-12 col-sm-12 col-md-12 text-center">
                            <div class="row text-center" style="margin-top: 10px;">  
                                <button v-if="productions.length <= 0 " type="button" class="btn default" @click="addItems('production')">
                                    @lang('layout.AddProduction')
                                </button>
                                <button v-if="services.length <= 0 " type="button" class="btn default" @click="addItems('service')">@lang('layout.Addservice')
                                </button>
                                <button type="button" class="btn green" onclick="regForm(this)">@lang('layout.Submit')</button>
                                <a href="{{route('project.index')}}" class="btn default"><i class="fa fa-mail-reply"></i> @lang('layout.Cancel')</a> 
                            </div>
                        </div>
                        <div class="portlet-body form" style="margin-bottom:50%;">
                            <!-- BEGIN FORM-->
                            {{-- {!! Form::model($projects, ['method' => 'PATCH','class'=>'form-horizontal','route' => ['project.update',$projects->id]]) !!} --}}
                            <div class="form-body" id="app" v-cloak>
                                
                            </div>
                        </div>
                    </div> 
                    {{-- <div class="tab-pane fade" id="home2">
                        <div>
                            <div class="row">
                                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                    
                                </div>
                            </div>
                            
                        </div> 
                    </div> --}}
                </div>
                {{Form::close()}}
            </div> 
        </div>
    </div>
    </div> 
@endsection
@push('scripts') 
<script src="{{url('/assets/bootstrap-colorpicker/js/bootstrap-colorpicker.js')}}" type="text/javascript"></script><script src="{{url('/assets/jquery-minicolors/jquery.minicolors.min.js')}}" type="text/javascript"></script> 
<script src="{{url('/assets/bootstrap-wysihtml5/wysihtml5-0.3.0.js')}}" type="text/javascript"></script>
<script src="{{url('/assets/bootstrap-wysihtml5/bootstrap-wysihtml5.js')}}" type="text/javascript"></script>
<script src="{{url('/assets/scripts/components-color-pickers.min.js')}}" type="text/javascript"></script> 
<script type="text/javascript">
    @if(App::getLocale())
    Vue.use(VeeValidate, {
        locale: '{{App::getLocale()}}',
    });
    @else
    Vue.use(VeeValidate, {
        locale: 'en',
    });
    @endif
    Vue.component('v-select', VueSelect.VueSelect);
    var Expense            = {!! json_encode($Expense) !!}
    var asset              = {!! json_encode($asset) !!}
    var Worktype           = {!! $work_types!!}
    var projectCategory    = {!! $projectCategory!!}
    var currency           = {!! $currency!!}  
    var serviceAll         = {!! $serviceList !!}; 
    var projectItems       = {!! $projectItems !!};
    var progresses         = {!! $project_progress !!};
    var projectGlasses     = {!! $projectGlasses !!};
    var selectedItem       = {!! $selected_item !!};
    var selectedItems      = {!! $selectedItem !!};
    var selected_services  = {!! $selected_services !!};
    var selectedCurrency   = {!! $selectedCurrency !!};
    var projects           = {!! $projects !!};
	var inventory_category = {!! $inventory_category !!};
	var assemblies         = {!! $assemblies !!};
    console.log(333333333, assemblies);
    var shareholder        = {!! $shareholder !!};
    var seletedShareholder = {!! $seletedShareholder !!};
    var selectedProjectStep= {!! $selectedProjectStep !!};
    var selectedProjectInfo= {!! $selectedProjectInfo !!};
    var projectSteps       = {!! $projectSteps !!};
    var seletedVolunteer   = {!! $seletedVolunteer !!};
    let selected_payment   = {!! $selected_payment !!};
    var banks              = {!! $banks!!}
    var user              = {!! $user!!}
    var v = new Vue({
        el: '#app',
        data: {
			Expense:Expense,
			asset:asset,
			assemblies:assemblies,
			inventory_category:inventory_category,
            selected_item:selectedItem,
            selectedItems:selectedItems,
            selected_service:selected_services,
            currency:currency,
            selected_currency:selectedCurrency, 
            vendor:[],
            selectedVendor1: {!! $selectedVendor1 !!},
            selectedVendor2: {!! $selectedVendor2 !!},
            selectedVendor3: {!! $selectedVendor3 !!},
            customer:[],
            selectedMember: {!! $selectedCustomer !!},
            selectedWorkType:null,
            selectedCategory:null,
            selectedProgress:null,
            exchanged_rate: {!!currency()->exchange_rate!!},
            shareholderData: [],
            projectStepList: [],
            projectInfoList: [],
            shareholder: shareholder,
            projectSteps: projectSteps,
            user: user,
            seletedShareholder: seletedShareholder,
            selectedProjectStep: selectedProjectStep,
            selectedProjectInfo: selectedProjectInfo,
            selected_index:0,
            temp_items:[],
            listAccounts:[], 
            type: 'bank',
            account: {},
            code: 0,
            inventories: [],  
            productions: [],
            services:[],
            FormulaItems: [],
            items:[],
            formula_list:[],
            Formulastatus:false,
            selected_formula:null,
            roundData:1,
            Formulastatus: false,
            BuildWithoutFormulastatus: false,
            Servicestatus: false,
            shareholderstatus: false,
            projectStepsCheckBox: false,
            printInformationCheckbox: false,
            receviesCheckBox: false,
            selected_income:null,
            expenseAccount:null,
            assetAccount:null,
            income:{!!$income!!},
            projects:projects,
            inventoryIndex:0,
            GlassIndex:0,
            serviceIndex:0,
            ProductionIndex:0,  
            serviceList: serviceAll,
            all_services: serviceAll,
            worktype: Worktype,
            projectCategory: projectCategory,
            employee: [],
            selectedEmployee: {!! $selectedEmployee !!},
            status: false,
            MoreOptionstatus: false,
            printingHouse: false,
            volunteeres: [],
            seletedVolunteer: seletedVolunteer,
            discountFiled: 0,
            discount_type:null,
            discountIsAmount:false,
            temp_production: [],
            num: [],
            banks: banks,
            selected_banks: null, 
            payments: [],
            selected_payment: selected_payment,
            defaultValue: 0,
            amount:null,
            projectDetails:{!!$projects!!},
            projectItems: projectItems, 
            project_progress: progresses,
            projectGlasses: projectGlasses,
        },
        computed:{
            selectedRate()
            {            
                this.rate= (this.selected_currency)?this.selected_currency.rate:0;
            },
            discount()
            {
                if(this.discountIsAmount){
                    if(this.subtotal>0 && this.discountFiled) {
                        return  (parseFloat(this.discountFiled) * 100) / (this.subtotal);
                    }else {
                        return 0;
                    }
                }else {
                    return this.discountFiled
                }
            },
            // calculate subtotal
            subtotal: function ()
            {
                var sum = 0; 
                for(var p=0;p<this.productions.length;p++)
                {
                    if(this.productions[p].items && this.productions[p].items)
                    {
                        if(this.productions[p].items.w_build_qty && this.productions[p].items.price)
                        {
                            console.log('ppppttt',this.productions[p]);
                            var qty      = this.productions[p]['items']['w_build_qty'];
                            var price    = this.productions[p]['items']['price'];
                            sum         += qty*price;
                        }
                    }
                }			
                if (this.productions.length > 0) {
                    this.BuildWithoutFormulastatus = true;
                }
                for(var i=0;i<this.FormulaItems.length;i++)
                {
                    if(this.FormulaItems[i].selected_formula && this.FormulaItems[i].selected_formula.build_qty)
                    {		
                    // console.log('fdfsdfsd',this.FormulaItems[i]);
                        var qty      = this.FormulaItems[i].selected_formula.build_qty;
                        @if(systemConfig()[30] == 1)
                        var price    = this.FormulaItems[i].selected_formula.cost * this.selected_currency['static_rate'] / this.selected_currency['rate'];
                        @else 
                        var price    = this.FormulaItems[i].selected_formula.cost * this.selected_currency['rate'];
                        @endif
                        sum  += qty*price;
                    }
                }
                for(var i=0;i<this.inventories.length;i++)
                {
                    if(this.inventories[i].item)
                    {	
                        // console.log('fdfsdfsd',this.inventories[i]);
                        var qty      = this.inventories[i].item.quantity;
                        @if(systemConfig()[30] == 1)
                        var price    = this.inventories[i].item.new_rate * this.selected_currency['static_rate'] / this.selected_currency['rate'];
                        @else 
                        var price    = this.inventories[i].item.new_rate * this.selected_currency['rate'];
                        @endif
                        sum         += qty*price;
                    }
                }
                for (var i = 0; i < this.services.length; i++) {
                    if (this.services[i].item && this.services[i].item !=null)
                    {
                        var rate=this.services[i]['item']['rate'];
                        var new_rate=this.services[i]['item']['new_rate'];
                        var smeasure_unit=this.services[i]['item']['measure']['measure_unit'];
                        var measure_unit=this.services[i]['item']['measure_unit'];
                        var quantity=this.services[i]['item']['quantity'];
                        // console.log('ffffff',this.selected_currency.exchange_rate, quantity, new_rate, rate);
                        if(new_rate !=rate && quantity>0)
                        { 
                            @if(systemConfig()[30] == 1)
                            sum +=new_rate*quantity * this.selected_currency.static_rate / this.selected_currency.exchange_rate;
                            @else 
                            sum +=new_rate*quantity*this.selected_currency.exchange_rate;
                            @endif
                        }
                        else
                        {  
                            @if(systemConfig()[30] == 1)
                            sum += quantity * ((rate * smeasure_unit / measure_unit) * this.selected_currency.static_rate / this.selected_currency.exchange_rate);
                            @else 
                            sum += quantity * ((rate * smeasure_unit / measure_unit) * this.selected_currency.exchange_rate);
                            @endif
                        }
                    }
                }
                return (sum);
            },
            // check data validation
            isError: function () 
            {
                var isError = false;
                var flag=false;
                return isError;
            },
            // filter the banks according to selected currency
        },
        mounted:function(){
            // initialize the selected item
            for(var i=0;i<this.selectedItems.length;i++)
            {
                this.inventories.push({item:this.selectedItems[i]});
            }
            this.inventories.push({item: null, item_category: null});
            // initialize the selected item
            for(var i=0;i<this.selected_item.length;i++)
            {
                this.productions.push({items:this.selected_item[i]});
            }
            this.productions.push({item: null, items: []});
            // initialize the selected Shareholder
            if (this.seletedShareholder.length > 0) {
                this.shareholderstatus = true;
            }
            if(this.seletedShareholder.length > 0)
            {
                for(var i=0;i<this.seletedShareholder.length;i++)
                {
                    this.shareholderData.push({shareholder_list: this.shareholder,selected:this.seletedShareholder[i],percentage: this.seletedShareholder[i].percentage});
                }
            }else{
                this.shareholderData.push({shareholder_list: this.shareholder,selected:null,percentage: 0});
            }
            // initialize the selected project steps 
            if(this.selectedProjectStep.length > 0){
                this.projectStepsCheckBox = true;
            }
            if(this.selectedProjectStep.length > 0){
                for(var i=0;i<this.selectedProjectStep.length;i++)
                {
                    var select_user = _.find(this.user, (o) => o.id == this.selectedProjectStep[i].selected_user_id);
                    this.projectStepList.push({
                        projectStep_list: projectSteps,
                        projectStepName:this.selectedProjectStep[i],
                        number: this.selectedProjectStep[i].number,
                        expense: this.selectedProjectStep[i].expense,
                        start_date: this.selectedProjectStep[i].start_date,
                        end_date: this.selectedProjectStep[i].end_date,
                        select_user: select_user,
                        description: this.selectedProjectStep[i].description,
                        image: this.selectedProjectStep[i].image,
                        selected_status: this.selectedProjectStep[i].status
                    });
                }
            }else{
                this.projectStepList.push({
                    projectStep_list: projectSteps,
                    projectStepName:null,
                    number: 0,
                    expense: 0,
                    start_date: null,
                    end_date: null,
                    select_user: null,
                    description: null,
                    selected_status: null
                });
            }
            // initialize the selected project info 
            if(this.selectedProjectInfo.length > 0){
                this.printInformationCheckbox = true;
            }
            if(this.selectedProjectInfo.length > 0){
                for(var i=0;i<this.selectedProjectInfo.length;i++){
                    this.projectInfoList.push({
                        project_issue: selectedProjectInfo[i].project_issue,
                        project_quentity: selectedProjectInfo[i].project_quentity,
                        project_type: selectedProjectInfo[i].project_type,
                        project_description: selectedProjectInfo[i].project_description
                    });
                }
            }else{
                this.projectInfoList.push({
                    project_issue:null,
                    project_quentity: null,
                    project_type: null,
                    project_description: null
                });
            }
            
            // initialize the selected project payments 
            if(this.selected_payment.length > 0){
                this.receviesCheckBox = true;
            }
            // initialize the selected Shareholder
            // begin payment initialization
            for (var t = 0; t < this.selected_payment.length; t++) {
                var foundFlag = false;
                var tempBank = null;
                for (var y = 0; y < this.banks.length; y++) {
                    if (this.selected_payment[t].id == this.banks[y].id) {
                        foundFlag = true;
                        tempBank = this.banks[y];
                        tempBank.amount = this.selected_payment[t].amount;
                        tempBank.rate = this.selected_payment[t].rate; 
                        tempBank.description = this.selected_payment[t].description;
                    }
                }
                if (foundFlag) {
                    this.payments.push({item: tempBank, items: this.banks});
                }
            }
            this.payments.push({item: null, items: banks});
                // end payment initialization
            if(this.seletedVolunteer.length > 0)
            {
                for(var i=0;i<this.seletedVolunteer.length;i++)
                {
                    this.volunteeres.push({name: this.seletedVolunteer[i].name, price: this.seletedVolunteer[i].price, discount: this.seletedVolunteer[i].discount, description: this.seletedVolunteer[i].description, type: this.seletedVolunteer[i].type});
                }
            }
            this.volunteeres.push({name: null, price: null, discount: null, description: null, type: 'Simple'});
            // initialize the selected item
            if (this.assemblies.length > 0) {
                this.Formulastatus = true;
            }
            if(this.assemblies){
                this.FormulaItems = [];
                this.FormulaItems = this.assemblies;
                for(var i=0;i<this.assemblies.length;i++)
                {
                    this.items.push({item:this.assemblies[i].selected_item});
                }
            }
            this.FormulaItems.push({item:null});
            // console.log('lplpl',this.FormulaItems);
            // for(var m=2;m>this.selected_item.length;m--)
            // {
            // this.productions.push({item:null});
            // }
            // end item
            if(this.income)
            {
                this.selected_income=this.income[0];
            }
            // begin service
            if (this.selected_service.length > 0) {
            }
            if (this.productions.length > 0) {
                this.Servicestatus = true;
            }
            for(var r=0;r<this.selected_service.length;r++)
            {
                var flag=false;
                var tempService;
                for(var h=0;h<this.all_services.length;h++)
                {
                if(this.all_services[h].id==this.selected_service[r].item_id)
                {
                    flag=true;
                    tempService           = this.all_services[h];
                    tempService.quantity  = this.selected_service[r].quantity;
                    tempService.rate      = this.selected_service[r].price;
                    tempService.new_rate  = this.selected_service[r].price;
                }
                }
                if(flag)
                {
                this.services.push({item:tempService,items:this.all_services})
                }
            }
            for(var w=1;w>this.selected_service.length;w--)
            {
                this.services.push({item:null,items:this.all_services});
            }
            //   this.services.push({items: this.all_services, item: null});
            // end service
            var n = 0;
            for(n = 0; n<this.worktype.length; n++){
                if(this.worktype[n].id == {{$projects->work_type}}){
                    this.selectedWorkType = this.worktype[n];
                }  
            }
            var t = 0;
            for(t = 0; t<this.projectCategory.length; t++){
                if(this.projectCategory[t].id == {{$projects->project_category_id}}){
                    this.selectedCategory = this.projectCategory[t];
                }  
            }
            var p = 0;
            for(p = 0; p<this.project_progress.length; p++){
                if(this.project_progress[p].id == {{ $projects->project_progress_id }}){
                    this.selectedProgress = this.project_progress[p];
                }
            }
            var ia = 0;
            for(ia = 0; ia<this.income.length; ia++){
                if(this.income[ia].id == {{ $projects->income_account_id }}){
                    this.selected_income = this.income[ia];
                }
            }
            var ea = 0; 
            for(ea = 0; ea<this.Expense.length; ea++){
                if(this.Expense[ea].id == {{ $projects->expense_account_id }}){
                    this.expenseAccount = this.Expense[ea];
                }
            }
            var aa = 0; 
            for(aa = 0; aa<this.asset.length; aa++){
                if(this.asset[aa].id == {{ $projects->asset_account_id }}){
                    this.assetAccount = this.asset[aa];
                }
            }
            if(this.projects)
            {
                if(this.projects.discount>0)
                {
                    this.discountFiled=this.projects.discount; 
                }
                else {
                    this.discountFiled=0; 
                }
                if(this.projects.discount_type)
                {
                    if(this.projects.discount_type=='percent')
                    {
                        if(this.projects.project_price){
                            this.discountFiled    = (parseFloat(this.discountFiled) * 100) / (this.projects.project_price);
                        } else if(this.subtotal){
                            this.discountFiled    = (parseFloat(this.discountFiled) * 100) / (this.subtotal);
                        }
                        this.discountIsAmount =false;
                    }
                    else
                    {
                       this.discountIsAmount=true;
                    }
                } 
                if(this.projects.status)
                {
                    this.status = true;
                }
                if(this.projects.location || this.projects.province || this.projects.district || this.projects.color || this.projects.project_progress_id || this.projects.project_category_id || this.projects.work_type_id || this.projects.memo)
                {
                    this.MoreOptionstatus = true;
                }
                if(this.projects.page_count || this.projects.circulation || this.projects.size || this.projects.color_count || this.projects.print || this.projects.binding_type || this.projects.form_count || this.projects.explanation || this.projects.paper_type_and_grammage || this.projects.cover_paper_type_and_grammage || this.projects.endpaper_type_and_grammage || this.projects.coating_paper_and_grammage)
                {
                    this.printingHouse = true;
                }
            }
        },
        methods:
        { 
            // in here you can check and decide to allow duplicate bank for payment or not
            checkExistingPayment(index = null, name = '') {
                var bank_temp = this.banks.slice();
                var bank_temp1 = [];
                for (var i = 0; i < this.payments.length; i++) {
                    if (this.payments[i].item != null) {
                        var fined = bank_temp.findIndex((item) => item.name == this.payments[i].item.name);
                        if (fined != -1) {
                            var o = bank_temp.splice(bank_temp.findIndex((item) => item.name == this.payments[i].item.name), 1);
                        }
                    }
                }
                this.payments[index].items = bank_temp.filter((item) => {
                    return (new RegExp(name.toLowerCase())).test(item.name.toLowerCase())
                });
            },
            setNumber(pStep){
                if(pStep.projectStepName){
                    pStep.number = pStep.projectStepName.number
                }
            },
            addItems(type)
            { 
                if(type !=null)
                {
                    if(type=="production")
                    { 
                    this.temp_production=[];
                    this.productions.push({item:null, items:{
                            name:null,
                            w_build_qty:0,
                            price:0
                        }}); 
                    }
                    if(type=="service")
                    {
                    this.services.push({item:null});
                    }
                }         
            },  
            onItemSearchProject:_.debounce((search,loading) =>{
                loading(true);
                let inventory_category_id = (v.inventories[v.selected_index]['item_category'] !=undefined)?v.inventories[v.selected_index]['item_category'].id:'';
                axios.get("{{route('callMethod.search')}}",{
                    params:{
                    member_id:v.member_id,
                    method_name:'itemSearchSale',
                    keyword:search,
                    inventory_category_id:inventory_category_id,
                    }
                })
                .then(function(response){
                    v.temp_items = [];
                    if(response.data.length >0)
                    {
                    v.temp_items = response.data;
                    }
                    loading(false);
                })
                .catch(function(error){
                    console.log(error);
                })
            },getDebounceTime()),
            MemberSearch: _.debounce((search, loading) => {
                loading(true);
                axios.get("{{route('callMethod.search')}}", {
                    params: {
                        method_name: 'SearchMember', 
                        keyword: search,
                        type: 'Customer'
                    }
                })
                .then(function(response) {
                    if (response.data.length > 0) {
                        // console.log(response.data);
                        v.customer = [];
                        v.customer = response.data;
                    }
                    loading(false);
                })
                .catch(function(error) {
                    loading(false);
                    console.log(error);
                })
            }, getDebounceTime()),
            VendorSearch: _.debounce((search, loading) => {
                loading(true);
                axios.get("{{route('callMethod.search')}}", {
                    params: {
                        method_name: 'SearchMember', 
                        keyword: search,
                        type: 'Vendor'
                    }
                })
                .then(function(response) {
                    if (response.data.length > 0) {
                        // console.log(response.data);
                        v.vendor = [];
                        v.vendor = response.data;
                    }
                    loading(false);
                })
                .catch(function(error) {
                    loading(false);
                    console.log(error);
                })
            }, getDebounceTime()),
            EmployeeSearch: _.debounce((search, loading) => {
                loading(true);
                axios.get("{{route('callMethod.search')}}", {
                    params: {
                        method_name: 'SearchMember', 
                        keyword: search,
                        type: 'Employee'
                    }
                })
                .then(function(response) {
                    if (response.data.length > 0) {
                        // console.log(response.data);
                        v.employee = [];
                        v.employee = response.data;
                    }
                    loading(false);
                })
                .catch(function(error) {
                    loading(false);
                    console.log(error);
                })
            }, getDebounceTime()),
            //ajax call to get items
            setIndex(e)
            {
                //v.temp_items=[];
                this.selected_index=e;
                console.log('uuu',this.selected_index);
            },
            itemCategoryChange(index){
                v.setIndex(index);
                let inventory_category_id = (v.inventories[v.selected_index]['item_category'] !=undefined)?v.inventories[v.selected_index]['item_category'].id:'';
                axios.get("{{route('callMethod.search')}}",{
                    params:{
                    member_id:v.member_id,
                    method_name:'itemSearchSale',
                    inventory_category_id: inventory_category_id
                    }
                })
                .then(function(response){
                    v.temp_items = [];
                    if(response.data.length >0)
                    {
                    v.temp_items = response.data;
                    }
                })
                .catch(function(error){
                    console.log(error);
                });
            },
            //ajax call to get items
            onItemSearch:_.debounce((search,loading)=>{
                //v.formula_list=[];
                loading(true);
                axios.get("{{route('callMethod.search')}}",{
                    params:{
                        method_name:'assemblyList',
                        keyword:search,
                    }
                })
                .then(function (response)
                {
                    v.items=[];
                    if(response.data.length>0)
                    {
                    v.items=response.data;
                    console.log('sssss',v.items);
                    }
                    loading(false);
                })
                .catch(function (error)
                {
                    console.log(error);
                });
            },getDebounceTime()),
            // end item search	   
            getItemFormula(index)
            {
                //console.log('ggg',this.FormulaItems);
                //item
                if(this.FormulaItems[index].selected_item && this.FormulaItems[index].selected_item !=null)
                {
                    this.formulaSearch(this.FormulaItems[index].selected_item.item_id,this,index);
                }
            },  
            //ajax call to get formula
            formulaSearch(item_id,vm,index)
            {
                axios.get("{{route('callMethod.search')}}",{
                    params:{
                    method_name:'item_formula',
                    item_id:item_id,
                    } 
                })
                .then(function (response)
                {
                    vm.FormulaItems[index].formula_list=[];
                    if(response.data.length>0)
                    {
                        vm.FormulaItems[index].formula_list=response.data;
                        vm.addNew('FormulaItems',0)
                        // console.log('formula',response.data);
                        console.log('yyyyy',vm.FormulaItems[index]);
                    
                    }
                })
                .catch(function (error)
                {
                    console.log(error);
                })
            },
            // end formula search 
            // Check selected Currency 
            checkSelected(){
                var allCarrencies = {!! json_encode(getCurrencies()) !!};
                for(var x in allCarrencies){
                    for(z in allCarrencies[x]){
                        if(allCarrencies[x][z] == "{!! $projects->currency !!}"){
                            this.selectedCurrency = allCarrencies[x]; 
                        } 
                    }
                } 
            },
            setData:function(){
            },
            setValuesAmount(index){ 
                if(this.inventories[index].item){
                    @if(systemConfig()[30] == 1)
                        this.inventories[index].item.rate = this.$refs.in[index].value / this.selected_currency.static_rate * this.exchanged_rate; console.log('in refs',this.inventories[index].item.rate);
                @else 
                        this.inventories[index].item.rate = this.$refs.in[index].value/this.exchanged_rate; console.log('in refs',this.inventories[index].item.rate);
                    @endif
                }
            },
            setValuesAmountS(index){
                // console.log('amountes',this.$refs.ins[index].value);
                if(this.services[index].item){
                    @if(systemConfig()[30] == 1)
                    this.services[index].item.rate = this.$refs.ins[index].value/this.selected_currency.static_rate * this.exchanged_rate; 
                    @else 
                    this.services[index].item.rate = this.$refs.ins[index].value/this.exchanged_rate; 
                    @endif
                    console.log('in refs service',this.services[index].item.rate);
                }
            },
            // calculate item price based on measure change
            measureChange(index)
            {
                if(this.inventories[index].item !=null){
                    var item=this.inventories[index].item; 
                    var temp=((item.rate*item.measure.measure_unit/item.measure_unit));
                    result=Number.parseFloat(temp).toFixed(precision());
                    this.inventories[index].item.new_rate =result;
                    // this.inventories[index].item.new_rate = this.$refs.in[index].value/this.selected_currency.rate;    
                }
            },
            // calculate item price based on measure change
            measureChangeservice(index)
            {
                if(this.services[index].item !=null){
                    var item=this.services[index].item;
                    @if(systemConfig()[30] == 1)
                    var temp=((item.rate*item.measure.measure_unit/item.measure_unit)*this.selected_currency.static_rate / this.selected_currency.rate);
                    @else 
                    var temp=((item.rate*item.measure.measure_unit/item.measure_unit)*this.selected_currency.rate);
                    @endif
                    result=Number.parseFloat(temp).toFixed(precision());
                    this.services[index].item.new_rate =result;
                    // this.inventories[index].item.new_rate = this.$refs.in[index].value/this.selected_currency.rate;    
                }
            },
            // detect member change and searh
            memberChange()
            {
                if(this.selected_customer)
                {
                    // get member contract
                    this.contractSearch(this.selected_customer.id,this);
                }
            },
            // set new price
            setNewRate(type=null,index)
            {
                if(type=='service')
                {
                    if(this.services[index].item)
                    {
                        @if(systemConfig()[30] == 1)
                        this.services[index].item.new_rate = this.$refs.ser[index].value/this.selected_currency.static_rate * this.selected_currency.exchange_rate;
                        @else 
                        this.services[index].item.new_rate = this.$refs.ser[index].value/this.selected_currency.exchange_rate;
                        @endif
                    }
                }
                if (type == 'inventory') {
                    if (this.inventories[index].item) { 
                        @if(systemConfig()[30] == 1)
                        this.inventories[index].item.new_rate = this.$refs.item_rate[index].value / this.selected_currency.static_rate * this.selected_currency.exchange_rate;
                        @else 
                        this.inventories[index].item.new_rate = this.$refs.item_rate[index].value / this.selected_currency.exchange_rate;
                        @endif
                    }
                }
            },
            // set new price
            // set new price
            setProduction(ind)
            {
                for(var i=0;i<this.productions.length;i++)
                {
                    if (this.productions[i].items != null) {
                        this.productions[i].items.name = this.$refs.name[i].value;
                        this.productions[i].items.w_build_qty = this.$refs.w_build_qty[i].value;
                        this.productions[i].items.price = this.$refs.price[i].value;
                    }
                }
            },
            //ajax call to get items
            //ajax call to get items
            // onItemSearch:_.debounce((search,loading)=>{
            // loading(true);
            // axios.get("{{route('callMethod.search')}}",{
                // params:{
                // method_name:'productionItem',
                // keyword:search,
                // }
            // })
            // .then(function (response)
            // {
                // v.temp_production=[];
                // if(response.data.length>0)
                // {
                    // v.temp_production=response.data;
                // }
                // loading(false);
            // })
            // .catch(function (error)
            // {
                // console.log(error);
            // });
            // },getDebounceTime()),
            contractSearch(id,vm)
            {
                vm.contract=[];
                axios.get("{{route('callMethod.search')}}",{
                    params:{
                    method_name:'member_contract',
                    member_id:id
                    }
                })
                .then(function (response)
                {
                    if(response.data.length>0)
                    {
                        vm.contract=response.data;
                    }
                    loading(false);
                })
                .catch(function (error)
                {
                    console.log(error);
                })
            },
            // end contract search
            // generic function for adding item to list
            // in here you can check and decide to allow duplicate service or not
            checkExistingService(index=null,name='')
            {      
                var service_temp=this.all_services.slice();
                var service_temp1=[];
                for(var i=0;i<this.services.length;i++)
                {
                    if(this.services[i].item !=null)
                    {
                        var fined=service_temp.findIndex((item)=> item.name == this.services[i].item.name);
                        if(fined !=-1)
                        {
                        var o=service_temp.splice(service_temp.findIndex((item)=>item.name == this.services[i].item.name),1);
                        }
                    }
                }
                this.services[index].items = service_temp.filter((item) => {
                    return (new RegExp(name.toLowerCase())).test(item.name.toLowerCase())
                });
                //this.payments[index].items =bank_temp; 
            },
            // generic function for adding item to list
            addNew(type=null,index)
            {
                this.temp_items=[];
                if(type !=null)
                {
                    if(type=='production')
                    {
                        if(this.productions[index+1]==undefined)
                        {
                            this.temp_production=[];
                            this.productions.push({item:null,items:{
                                name:null,
                                w_build_qty:0,
                                price:0
                            }});
                        }
                    }
                    if (type == 'volunteeres') {
                        if (this.volunteeres[index + 1] == undefined) {
                            this.volunteeres.push({name: null, price: null, discount: null, description: null, type: 'Simple'});
                        }
                    }
                    if(type=='FormulaItems')
                    {
                        if(this.FormulaItems[index+1]==undefined)
                        {
                            this.items=[];
                            this.FormulaItems.push({item:null});
                        }
                    }
                    if (type == 'shareholder') {
                        if (this.shareholderData[index + 1] == undefined) {
                            this.shareholderData.push({percentage: 0, shareholder_list: this.shareholder, selected: null});
                        }
                    }
                    if (type == 'projectSteps') {
                        if (this.projectStepList[index + 1] == undefined) {
                            this.projectStepList.push({
                                number: 0, 
                                expense: 0, 
                                projectStep_list: this.projectSteps, 
                                select_user: null,
                                projectStepName: null
                            });
                        }
                    }
                    if (type == 'projectInfo') {
                        if (this.projectInfoList[index + 1] == undefined) {
                            this.projectInfoList.push({
                                project_quentity: null,
                                project_type: null,
                                project_description: null
                            });
                        }
                    }
                    if (type == 'payment') {
                        if (this.payments[index + 1] == undefined) {
                            this.checkExistingPayment(index, '');
                            this.payments.push({
                                items: this.banks,
                                item: null,
                            });
                        }
                    }
                    if(type=='service')
                    {
                        if(this.services[index+1]==undefined)
                        {
                            this.checkExistingService(index,'');
                            this.services.push({
                                items: this.all_services,
                                item: null,
                            });
                        }
                    }
                    if(type=='inventory')
                    {
                        if(this.inventories[index+1]==undefined)
                        {
                            this.temp_items=[];
                            this.inventories.push({item:null,item_category:null});
                        }
                    }        
                }
            },
            // delete item from list
            deleteItem(type=null,index)
            {
                if(type !=null)
                { 
                    if(type=='inventory')
                    {
                        this.inventories.splice(index, 1);
                    }
                    if (type == 'volunteeres') {
                        this.volunteeres.splice(index, 1);
                    }
                    if (type == 'shareholder') {
                        this.shareholderData.splice(index, 1);
                    }
                    if (type == 'projectSteps') {
                        this.projectStepList.splice(index, 1);
                    }
                    if (type == 'projectInfo') {
                        this.projectInfoList.splice(index, 1);
                    }
                    if (type == 'payment') {
                        this.payments.splice(index, 1);
                    }
                    if(type=='FormulaItems')
                    {
                        this.FormulaItems.splice(index, 1);
                    }
                    if(type=='production')
                    {
                        this.productions.splice(index, 1);
                    }
                    if(type=='service')
                    {
                        this.services.splice(index, 1);
                    }
                }  
            },
        // submit the form
        },
        created:function()
        {   
        }
    });
</script>
@endpush