%PDF-
%PDF-
Mini Shell
Mini Shell
@extends('layouts.backend')
@section('title', $siteTitle)
@section('action')
<button type="button" class="btn btn-sm btn-success submit-btn">Submit</button>
@endsection
@push('styles')
<style>
.append-btn button {
width: 25px;
height: 25px;
text-align: center;
line-height: 25px;
border-radius: 50%;
border: 0;
font-size: 12px;
color: #fff;
}
</style>
@endpush
@section('content')
<div class="row">
<div class="col-12">
<form action="{{ route('app.users.store') }}" method="POST" id="member-form" enctype="multipart/form-data">
@csrf
@isset($user)
@method('PUT')
@endisset
<div class="row">
<div class="col-md-6">
<div class="ibox">
<div class="ibox-head">
<div class="ibox-title w-100">New Manager</div>
</div>
<div class="ibox-body">
<x-form.inputbox name="full_name" class="full_name" labelName="Full Name" required="required" placeholder="Enter name" value="{{ $user->name ?? old('full_name') }}" />
<x-form.inputbox type="email" name="email" class="email" labelName="Email" required="required" placeholder="Enter Email" value="{{ $user->email ?? old('email') }}" />
<div class="form-group">
<label for="">Target</label>
<input type="text" class="form-control" readonly value="0.00" disabled id="target">
</div>
<div class="form-group">
<label for="">Sale Target</label>
<input type="text" name="sale_target" class="form-control" value="0.00">
</div>
<input type="hidden" name="target" value="{{ $user->target ?? '' }}">
<div class="row">
<div class="col-md-9">
<x-form.inputicon type="password" groupClass="password" name="password" labelName="Password" required="required" placeholder="xxxxxxxx" value="{!! isset($user) ? $user->password_text : '' !!}" icon="fa fa-eye" addonClass="password-text cursor-pointer"/>
</div>
<div class="col-md-3 text-right">
<label for="" class="opacity-0">hello</label>
<button type="button" class="btn btn-md btn-primary generate-pass">Generate</button>
</div>
</div>
<button class="btn btn-sm btn-success submit-btn" type="button">Submit</button>
</div>
</div>
</div>
<div class="col-md-6">
<div class="ibox">
<div class="ibox-head">
<div class="ibox-title text-capitalize">add new agent under this manager</div>
</div>
<div class="ibox-body">
<div id="permission_table">
</div>
<div class="text-right mb-2">
<button type="button" class="bg-primary btn btn-sm border-0 text-light add_permission" id="add_permission"><i class="fa fa-plus fa-sm"></i> Add Agent</button>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
@endsection
@push('scripts')
<script>
// random password generate
function generatePass() {
let chars = "1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ!@#$%^&*";
let passLength = 8;
let password = "";
for (let i = 0; i < passLength; i++)
password += chars[Math.floor(Math.random() * chars.length)];
return password;
}
// random password value
$(document).on('click','button.generate-pass', function(){
$('input[name="password"]').val(generatePass());
})
// password input type text
$(document).on('click','.password-text',function(){
if($(this).children().hasClass('fa-eye')){
$(this).children().removeClass('fa-eye');
$(this).children().addClass('fa-eye-slash');
$('input[name="password"]').attr('type','text');
}else{
$(this).children().removeClass('fa-eye-slash');
$(this).children().addClass('fa-eye');
$('input[name="password"]').attr('type','password');
}
});
// Dynamic permission field add remove
var count = 0;
function dynamicPermissionField(row){
var html = `
<div class="agent-box mb-3">
<div class="append-btn text-right mb-2">
<button type="button" class="bg-danger add_permission remove_permission"><i class="fa fa-minus fa-sm"></i></button>
</div>
<x-form.inputbox name="agent[`+row+`][name]" class="agent_`+row+`_name" placeholder="Full Name"/>
<x-form.inputbox name="agent[`+row+`][email]" class="agent_`+row+`_email" placeholder="Email"/>
<div class="form-group">
<input type="number" name="agent[`+row+`][target]" id="target-amount" class="form-control agent_`+row+`_target" placeholder="Target"/>
</div>
<x-form.textarea name="agent[`+row+`][description]" class="agent_`+row+`_description" placeholder="Description"></x-form.textarea>
</div>`;
$('#permission_table').append(html);
}
// add agent field
$(document).on('click', '#add_permission', function () {
count++;
dynamicPermissionField(count);
});
// remove agent field
$(document).on('click', '.remove_permission', function () {
count--;
$(this).closest('div.agent-box').remove();
totalTargetCalculate();
});
// ***** total target ***** //
$(document).on('keyup', '.agent-box input#target-amount', function(){
totalTargetCalculate();
});
// calculation
function totalTargetCalculate(){
var total = 0;
$('input#target-amount').each(function(){
total += parseFloat($(this).val() || 0);
});
var totalA = total == 0 ? '0.00' : total;
$('input#target').val(totalA);
$('input[name="target"]').val(totalA);
}
$(document).on('click', 'button.submit-btn', function(){
var form = document.getElementById('member-form');
var formData = new FormData(form);
$.ajax({
url: "{{ route('app.users.store') }}",
type: "post",
data: formData,
dataType: false,
contentType: false,
processData: false,
cache: false,
success: function(response){
// validation form
$('#member-form').find('.error-msg').remove();
if(response.status == false){
$.each(response.errors, function (key, value) {
$('#member-form .'+key).parent().append('<small class="error-msg text-danger d-block">'+value+'</small>');
});
}else{
if(response.status == 'success'){
window.location.href="{{ route('app.users.index') }}";
flashMessage(response.status, response.message);
}else{
flashMessage(response.status, response.message);
}
}
},
error: function(error){
console.log(error);
}
});
});
</script>
@endpush
Zerion Mini Shell 1.0