kevinowino869/mitrobill
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Location Picker

Browse Source
This commit is contained in:
Ibnu Maksum 2024-03-22 21:21:23 +07:00
parent ffe913cb8f
commit 177cdef1cd
No known key found for this signature in database
GPG Key ID: 7FC82848810579E5
8 changed files with 218 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -5,6 +5,7 @@
## 2024.3.22 ## 2024.3.22
- Fix Broadcast Message by @Focuslinkstech - Fix Broadcast Message by @Focuslinkstech
- Add Location Picker
## 2024.3.20 ## 2024.3.20

7
system/controllers/customers.php
View File

@ -16,6 +16,10 @@ if (empty ($action)) {
$action = 'list'; $action = 'list';
} }
$leafletpickerHeader = <<<EOT
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.3/dist/leaflet.css">
EOT;
switch ($action) { switch ($action) {
case 'list': case 'list':
$search = _post('search'); $search = _post('search');
@ -89,6 +93,7 @@ switch ($action) {
if (!in_array($admin['user_type'], ['SuperAdmin', 'Admin', 'Agent', 'Sales'])) { if (!in_array($admin['user_type'], ['SuperAdmin', 'Admin', 'Agent', 'Sales'])) {
_alert(Lang::T('You do not have permission to access this page'), 'danger', "dashboard"); _alert(Lang::T('You do not have permission to access this page'), 'danger', "dashboard");
} }
$ui->assign('xheader', $leafletpickerHeader);
run_hook('view_add_customer'); #HOOK run_hook('view_add_customer'); #HOOK
$ui->display('customers-add.tpl'); $ui->display('customers-add.tpl');
break; break;
@ -210,7 +215,6 @@ switch ($action) {
$customFields = ORM::for_table('tbl_customers_fields') $customFields = ORM::for_table('tbl_customers_fields')
->where('customer_id', $customer['id']) ->where('customer_id', $customer['id'])
->find_many(); ->find_many();
$v = $routes['3']; $v = $routes['3'];
if (empty ($v)) { if (empty ($v)) {
$v = 'activation'; $v = 'activation';
@ -260,6 +264,7 @@ switch ($action) {
if ($d) { if ($d) {
$ui->assign('d', $d); $ui->assign('d', $d);
$ui->assign('customFields', $customFields); $ui->assign('customFields', $customFields);
$ui->assign('xheader', $leafletpickerHeader);
$ui->display('customers-edit.tpl'); $ui->display('customers-edit.tpl');
} else { } else {
r2(U . 'customers/list', 'e', $_L['Account_Not_Found']); r2(U . 'customers/list', 'e', $_L['Account_Not_Found']);

3
system/lan/english.json
View File

@ -534,5 +534,6 @@
"20_Seconds": "20 Seconds", "20_Seconds": "20 Seconds",
"Use_at_least_5_secs_if_you_are_sending_to_all_customers_to_avoid_being_banned_by_your_message_provider": "Use at least 5 secs if you are sending to all customers to avoid being banned by your message provider", "Use_at_least_5_secs_if_you_are_sending_to_all_customers_to_avoid_being_banned_by_your_message_provider": "Use at least 5 secs if you are sending to all customers to avoid being banned by your message provider",
"Testing__if_checked_no_real_message_is_sent_": "Testing [if checked no real message is sent]", "Testing__if_checked_no_real_message_is_sent_": "Testing [if checked no real message is sent]",
"All_fields_are_required": "All fields are required" "All_fields_are_required": "All fields are required",
"Personal": "Personal"
} }

105
ui/ui/customers-add.tpl
View File

@ -11,10 +11,10 @@
<div class="col-md-9"> <div class="col-md-9">
<div class="input-group"> <div class="input-group">
{if $_c['country_code_phone']!= ''} {if $_c['country_code_phone']!= ''}
<span class="input-group-addon" id="basic-addon1">+</span> <span class="input-group-addon" id="basic-addon1">+</span>
{else} {else}
<span class="input-group-addon" id="basic-addon1"><i <span class="input-group-addon" id="basic-addon1"><i
class="glyphicon glyphicon-phone-alt"></i></span> class="glyphicon glyphicon-phone-alt"></i></span>
{/if} {/if}
<input type="text" class="form-control" name="username" required <input type="text" class="form-control" name="username" required
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}"> placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}">
@ -38,10 +38,10 @@
<div class="col-md-9"> <div class="col-md-9">
<div class="input-group"> <div class="input-group">
{if $_c['country_code_phone']!= ''} {if $_c['country_code_phone']!= ''}
<span class="input-group-addon" id="basic-addon1">+</span> <span class="input-group-addon" id="basic-addon1">+</span>
{else} {else}
<span class="input-group-addon" id="basic-addon1"><i <span class="input-group-addon" id="basic-addon1"><i
class="glyphicon glyphicon-phone-alt"></i></span> class="glyphicon glyphicon-phone-alt"></i></span>
{/if} {/if}
<input type="text" class="form-control" name="phonenumber" <input type="text" class="form-control" name="phonenumber"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}"> placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}">
@ -73,17 +73,6 @@
<textarea name="address" id="address" class="form-control"></textarea> <textarea name="address" id="address" class="form-control"></textarea>
</div> </div>
</div> </div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Coordinates')}</label>
<div class="col-md-9">
<input name="coordinates" id="coordinates" class="form-control" value=""
placeholder="6.465422, 3.406448">
<span class="help-block">
<small>{Lang::T('Latitude and Longitude coordinates for map must be separate with comma
","')}</small>
</span>
</div>
</div>
<div class="form-group"> <div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Service Type')}</label> <label class="col-md-3 control-label">{Lang::T('Service Type')}</label>
<div class="col-md-9"> <div class="col-md-9">
@ -102,7 +91,15 @@
<option value="Personal">Personal <option value="Personal">Personal
</option> </option>
<option value="Business">Business</option> <option value="Business">Business</option>
</select> </select>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Coordinates')}</label>
<div class="col-md-9">
<input name="coordinates" id="coordinates" class="form-control" value=""
placeholder="6.465422, 3.406448">
<div id="map" style="width: '100%'; height: 200px; min-height: 150px;"></div>
</div> </div>
</div> </div>
</div> </div>
@ -132,16 +129,16 @@
</center> </center>
</form> </form>
{literal} {literal}
<script type="text/javascript"> <script type="text/javascript">
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function() {
var customFieldsContainer = document.getElementById('custom-fields-container'); var customFieldsContainer = document.getElementById('custom-fields-container');
var addCustomFieldButton = document.getElementById('add-custom-field'); var addCustomFieldButton = document.getElementById('add-custom-field');
addCustomFieldButton.addEventListener('click', function () { addCustomFieldButton.addEventListener('click', function() {
var fieldIndex = customFieldsContainer.children.length; var fieldIndex = customFieldsContainer.children.length;
var newField = document.createElement('div'); var newField = document.createElement('div');
newField.className = 'form-group'; newField.className = 'form-group';
newField.innerHTML = ` newField.innerHTML = `
<div class="col-md-4"> <div class="col-md-4">
<input type="text" class="form-control" name="custom_field_name[]" placeholder="Name"> <input type="text" class="form-control" name="custom_field_name[]" placeholder="Name">
</div> </div>
@ -152,17 +149,53 @@
<button type="button" class="remove-custom-field btn btn-danger btn-sm">-</button> <button type="button" class="remove-custom-field btn btn-danger btn-sm">-</button>
</div> </div>
`; `;
customFieldsContainer.appendChild(newField); customFieldsContainer.appendChild(newField);
}); });
customFieldsContainer.addEventListener('click', function (event) { customFieldsContainer.addEventListener('click', function(event) {
if (event.target.classList.contains('remove-custom-field')) { if (event.target.classList.contains('remove-custom-field')) {
var fieldContainer = event.target.parentNode.parentNode; var fieldContainer = event.target.parentNode.parentNode;
fieldContainer.parentNode.removeChild(fieldContainer); fieldContainer.parentNode.removeChild(fieldContainer);
} }
});
}); });
}); </script>
</script> <script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js"></script>
<script>
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
setupMap(51.505, -0.09);
}
}
function showPosition(position) {
setupMap(position.coords.latitude, position.coords.longitude);
}
function setupMap(lat, lon) {
var map = L.map('map').setView([lat, lon], 13);
L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png', {
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
subdomains: 'abcd',
maxZoom: 20
}).addTo(map);
var marker = L.marker([lat, lon]).addTo(map);
map.on('click', function(e){
var coord = e.latlng;
var lat = coord.lat;
var lng = coord.lng;
var newLatLng = new L.LatLng(lat, lng);
marker.setLatLng(newLatLng);
$('#coordinates').val(lat + ',' + lng);
});
}
window.onload = function() {
getLocation();
}
</script>
{/literal} {/literal}

141
ui/ui/customers-edit.tpl
View File

@ -12,10 +12,10 @@
<div class="col-md-9"> <div class="col-md-9">
<div class="input-group"> <div class="input-group">
{if $_c['country_code_phone']!= ''} {if $_c['country_code_phone']!= ''}
<span class="input-group-addon" id="basic-addon1">+</span> <span class="input-group-addon" id="basic-addon1">+</span>
{else} {else}
<span class="input-group-addon" id="basic-addon1"><i <span class="input-group-addon" id="basic-addon1"><i
class="glyphicon glyphicon-phone-alt"></i></span> class="glyphicon glyphicon-phone-alt"></i></span>
{/if} {/if}
<input type="text" class="form-control" name="username" value="{$d['username']}" <input type="text" class="form-control" name="username" value="{$d['username']}"
required required
@ -41,10 +41,10 @@
<div class="col-md-9"> <div class="col-md-9">
<div class="input-group"> <div class="input-group">
{if $_c['country_code_phone']!= ''} {if $_c['country_code_phone']!= ''}
<span class="input-group-addon" id="basic-addon1">+</span> <span class="input-group-addon" id="basic-addon1">+</span>
{else} {else}
<span class="input-group-addon" id="basic-addon1"><i <span class="input-group-addon" id="basic-addon1"><i
class="glyphicon glyphicon-phone-alt"></i></span> class="glyphicon glyphicon-phone-alt"></i></span>
{/if} {/if}
<input type="text" class="form-control" name="phonenumber" value="{$d['phonenumber']}" <input type="text" class="form-control" name="phonenumber" value="{$d['phonenumber']}"
placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}"> placeholder="{if $_c['country_code_phone']!= ''}{$_c['country_code_phone']}{/if} {Lang::T('Phone Number')}">
@ -77,16 +77,6 @@
<textarea name="address" id="address" class="form-control">{$d['address']}</textarea> <textarea name="address" id="address" class="form-control">{$d['address']}</textarea>
</div> </div>
</div> </div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Coordinates')}</label>
<div class="col-md-9">
<input name="coordinates" id="coordinates" class="form-control" value="{$d['coordinates']}">
<span class="help-block">
<small>{Lang::T('Latitude and Longitude coordinates for map must be separate with comma
","')}</small>
</span>
</div>
</div>
<div class="form-group"> <div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Service Type')}</label> <label class="col-md-3 control-label">{Lang::T('Service Type')}</label>
<div class="col-md-9"> <div class="col-md-9">
@ -98,15 +88,23 @@
</select> </select>
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Account Type')}</label> <label class="col-md-3 control-label">{Lang::T('Account Type')}</label>
<div class="col-md-9"> <div class="col-md-9">
<select class="form-control" id="account_type" name="account_type"> <select class="form-control" id="account_type" name="account_type">
<option value="Personal" {if $d['account_type'] eq 'Personal' }selected{/if}>Personal <option value="Personal" {if $d['account_type'] eq 'Personal' }selected{/if}>Personal
</option> </option>
<option value="Business" {if $d['account_type'] eq 'Business' }selected{/if}>Business</option> <option value="Business" {if $d['account_type'] eq 'Business' }selected{/if}>Business
</select> </option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">{Lang::T('Coordinates')}</label>
<div class="col-md-9">
<input name="coordinates" id="coordinates" class="form-control" value="{$d['coordinates']}"
placeholder="6.465422, 3.406448">
<div id="map" style="width: '100%'; height: 200px; min-height: 150px;"></div>
</div> </div>
</div> </div>
</div> </div>
@ -118,20 +116,20 @@
<div class="panel-body"> <div class="panel-body">
<!--Customers Attributes edit start --> <!--Customers Attributes edit start -->
{if $customFields} {if $customFields}
{foreach $customFields as $customField} {foreach $customFields as $customField}
<div class="form-group"> <div class="form-group">
<label class="col-md-4 control-label" <label class="col-md-4 control-label"
for="{$customField.field_name}">{$customField.field_name}</label> for="{$customField.field_name}">{$customField.field_name}</label>
<div class="col-md-6"> <div class="col-md-6">
<input class="form-control" type="text" name="custom_fields[{$customField.field_name}]" <input class="form-control" type="text" name="custom_fields[{$customField.field_name}]"
id="{$customField.field_name}" value="{$customField.field_value}"> id="{$customField.field_name}" value="{$customField.field_value}">
</div> </div>
<label class="col-md-2"> <label class="col-md-2">
<input type="checkbox" name="delete_custom_fields[]" value="{$customField.field_name}"> <input type="checkbox" name="delete_custom_fields[]" value="{$customField.field_name}">
Delete Delete
</label> </label>
</div> </div>
{/foreach} {/foreach}
{/if} {/if}
<!--Customers Attributes edit end --> <!--Customers Attributes edit end -->
<!-- Customers Attributes add start --> <!-- Customers Attributes add start -->
@ -155,16 +153,16 @@
</form> </form>
{literal} {literal}
<script type="text/javascript"> <script type="text/javascript">
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function() {
var customFieldsContainer = document.getElementById('custom-fields-container'); var customFieldsContainer = document.getElementById('custom-fields-container');
var addCustomFieldButton = document.getElementById('add-custom-field'); var addCustomFieldButton = document.getElementById('add-custom-field');
addCustomFieldButton.addEventListener('click', function () { addCustomFieldButton.addEventListener('click', function() {
var fieldIndex = customFieldsContainer.children.length; var fieldIndex = customFieldsContainer.children.length;
var newField = document.createElement('div'); var newField = document.createElement('div');
newField.className = 'form-group'; newField.className = 'form-group';
newField.innerHTML = ` newField.innerHTML = `
<div class="col-md-4"> <div class="col-md-4">
<input type="text" class="form-control" name="custom_field_name[]" placeholder="Name"> <input type="text" class="form-control" name="custom_field_name[]" placeholder="Name">
</div> </div>
@ -175,17 +173,58 @@
<button type="button" class="remove-custom-field btn btn-danger btn-sm">-</button> <button type="button" class="remove-custom-field btn btn-danger btn-sm">-</button>
</div> </div>
`; `;
customFieldsContainer.appendChild(newField); customFieldsContainer.appendChild(newField);
}); });
customFieldsContainer.addEventListener('click', function (event) { customFieldsContainer.addEventListener('click', function(event) {
if (event.target.classList.contains('remove-custom-field')) { if (event.target.classList.contains('remove-custom-field')) {
var fieldContainer = event.target.parentNode.parentNode; var fieldContainer = event.target.parentNode.parentNode;
fieldContainer.parentNode.removeChild(fieldContainer); fieldContainer.parentNode.removeChild(fieldContainer);
} }
});
}); });
}); </script>
</script>
<script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js"></script>
<script>
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
setupMap(51.505, -0.09);
}
}
function showPosition(position) {
setupMap(position.coords.latitude, position.coords.longitude);
}
function setupMap(lat, lon) {
var map = L.map('map').setView([lat, lon], 13);
L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png', {
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
subdomains: 'abcd',
maxZoom: 20
}).addTo(map);
var marker = L.marker([lat, lon]).addTo(map);
map.on('click', function(e) {
var coord = e.latlng;
var lat = coord.lat;
var lng = coord.lng;
var newLatLng = new L.LatLng(lat, lng);
marker.setLatLng(newLatLng);
$('#coordinates').val(lat + ',' + lng);
});
}
window.onload = function() {
{/literal}{if $d['coordinates']}
setupMap({$d['coordinates']});
{else}
getLocation();
{/if}{literal}
}
</script>
{/literal} {/literal}
{include file="sections/footer.tpl"} {include file="sections/footer.tpl"}

2
ui/ui/customers-view.tpl
View File

@ -38,7 +38,7 @@
</li> </li>
{/if} {/if}
<li class="list-group-item"> <li class="list-group-item">
<b>{Lang::T('Coordinates')}</b> <span class="pull-right">{Lang::T($d['coordinates'])}</span> <b>{Lang::T('Coordinates')}</b> <span class="pull-right">{$d['coordinates']}</span>
</li> </li>
<!--Customers Attributes view start --> <!--Customers Attributes view start -->
{if $customFields} {if $customFields}

80
ui/ui/map-customer.tpl
View File

@ -4,42 +4,58 @@
<div id="map" style="width: '100%'; height: 600px; margin: 20px auto"></div> <div id="map" style="width: '100%'; height: 600px; margin: 20px auto"></div>
{literal} {literal}
<script> <script>
window.onload = function() { function getLocation() {
var map = L.map('map').setView([51.505, -0.09], 13); if (navigator.geolocation) {
var group = L.featureGroup().addTo(map); navigator.geolocation.getCurrentPosition(showPosition);
} else {
var customers = {/literal}{$customers|json_encode}{literal}; setupMap(51.505, -0.09);
}
}
L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png', { function showPosition(position) {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>', setupMap(position.coords.latitude, position.coords.longitude);
subdomains: 'abcd', }
maxZoom: 20
}).addTo(map);
customers.forEach(function(customer) { function setupMap(lat, lon) {
var name = customer.id; var map = L.map('map').setView([lat, lon], 13);
var name = customer.name; var group = L.featureGroup().addTo(map);
var info = customer.info;
var coordinates = customer.coordinates;
var balance = customer.balance;
var address = customer.address;
// Create a popup for the marker var customers = {/literal}{$customers|json_encode}{literal};
var popupContent = "<strong>Customer Name</strong>: " + name + "<br>" +
"<strong>Customer Info</strong>: " + info + "<br>" +
"<strong>Customer Balance</strong>: " + balance + "<br>" +
"<strong>Address</strong>: " + address + "<br>" +
"<strong>Coordinates</strong>: " + coordinates + "<br>" +
"<a href='{/literal}{$_url}{literal}customers/view/"+ customer.id +"'>More Info</a><br>";
// Add marker to map L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png', {
var marker = L.marker(JSON.parse(coordinates)).addTo(group); attribution:
marker.bindTooltip(name).bindPopup(popupContent); '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
}); subdomains: 'abcd',
maxZoom: 20
}).addTo(map);
map.fitBounds(group.getBounds()); customers.forEach(function(customer) {
} var name = customer.id;
</script> var name = customer.name;
var info = customer.info;
var coordinates = customer.coordinates;
var balance = customer.balance;
var address = customer.address;
// Create a popup for the marker
var popupContent = "<strong>Customer Name</strong>: " + name + "<br>" +
"<strong>Customer Info</strong>: " + info + "<br>" +
"<strong>Customer Balance</strong>: " + balance + "<br>" +
"<strong>Address</strong>: " + address + "<br>" +
"<strong>Coordinates</strong>: " + coordinates + "<br>" +
"<a href='{/literal}{$_url}{literal}customers/view/"+ customer.id +"'>More Info</a><br>";
// Add marker to map
var marker = L.marker(JSON.parse(coordinates)).addTo(group);
marker.bindTooltip(name).bindPopup(popupContent);
});
map.fitBounds(group.getBounds());
}
window.onload = function() {
getLocation();
}
</script>
{/literal} {/literal}
{include file="sections/footer.tpl"} {include file="sections/footer.tpl"}

2
version.json
View File

@ -1,3 +1,3 @@
{ {
"version": "2024.3.22" "version": "2024.3.22.1"
} }