Map: Header, Button, Link
This commit is contained in:
parent
5521ca934d
commit
d3b760fbf2
|
|
@ -102,16 +102,13 @@
|
|||
|
||||
|
||||
/*------------------------------*/
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.close {
|
||||
float: right;
|
||||
font-size: 22.5px;
|
||||
font-weight: bold;
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
line-height: 1;
|
||||
font-size: 75px;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
text-shadow: 0 1px 0 #ffffff;
|
||||
/* opacity: 0.2; */
|
||||
|
|
@ -214,8 +211,12 @@ button.close {
|
|||
}
|
||||
|
||||
.modal-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid #e5e5e5
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
}
|
||||
|
||||
#sidebar-left .modal-header {
|
||||
|
|
@ -228,10 +229,18 @@ button.close {
|
|||
}
|
||||
|
||||
.modal-title {
|
||||
flex: none;
|
||||
width: 300px !important;
|
||||
text-align: left;
|
||||
white-space: normal;
|
||||
word-wrap: break-word;
|
||||
overflow: visible;
|
||||
margin: 0;
|
||||
line-height: 1.42857143
|
||||
line-height: 1.42857143;
|
||||
padding-right: 60px;
|
||||
}
|
||||
|
||||
|
||||
.modal-body {
|
||||
position: relative;
|
||||
padding: 20px
|
||||
|
|
|
|||
|
|
@ -1680,7 +1680,7 @@ table.table-search-report .tb-list th {
|
|||
pointer-events: auto;
|
||||
cursor: pointer;
|
||||
color:var(--color-sub);
|
||||
font-size: 16px;
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
|
|
@ -1689,14 +1689,52 @@ table.table-search-report .tb-list th {
|
|||
}
|
||||
|
||||
.point-overlay {
|
||||
background-color:white;
|
||||
width:350px;
|
||||
z-index: 1000;
|
||||
cursor:default;
|
||||
pointer-events: auto;
|
||||
padding:5px;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
background-color:white;
|
||||
padding: 5px;
|
||||
border-radius: 5px;
|
||||
width: 350px;
|
||||
user-select: none;
|
||||
transform: none !important;
|
||||
cursor:default;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.address-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: stretch;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.address-title {
|
||||
width: 40%;
|
||||
padding: 5px 10px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
background-color: var(--color-sub);
|
||||
color: #fff;
|
||||
border-right: .5px solid #c9e0d3;
|
||||
border-left: .5px solid #c9e0d3;
|
||||
border-bottom: .5px solid #c9e0d3;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.address-content {
|
||||
width: 60%;
|
||||
padding: 5px 10px;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
border-right: .5px solid #c9e0d3;
|
||||
border-bottom: .5px solid #c9e0d3;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.address-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#popupMessage {
|
||||
|
|
|
|||
|
|
@ -84,7 +84,9 @@ class API extends CONF {
|
|||
IFNULL(DATE_FORMAT(tc.c_lastpickupdate,'%Y-%m-%d'),'') as c_lastpickupdate,
|
||||
IFNULL(DATE_FORMAT(tc.c_lastpaiddate,'%Y-%m-%d'),'') as c_lastpaiddate,
|
||||
IFNULL(tc.c_geolat,'') as lat,
|
||||
IFNULL(tc.c_geolon,'') as lon
|
||||
IFNULL(tc.c_geolon,'') as lon,
|
||||
td.d_ruid,
|
||||
td.r_note
|
||||
FROM
|
||||
(SELECT
|
||||
c_uid,
|
||||
|
|
@ -110,17 +112,21 @@ class API extends CONF {
|
|||
FROM
|
||||
tbl_customer) tc,
|
||||
(SELECT
|
||||
d_uid,
|
||||
d_customeruid,
|
||||
d_orderdate,
|
||||
d_quantity,
|
||||
d_estquantity,
|
||||
d_ordertype,
|
||||
d_driveruid,
|
||||
d_createruid,
|
||||
d_status
|
||||
td.d_uid,
|
||||
td.d_ruid,
|
||||
tr.r_note,
|
||||
td.d_customeruid,
|
||||
td.d_orderdate,
|
||||
td.d_quantity,
|
||||
td.d_estquantity,
|
||||
td.d_ordertype,
|
||||
td.d_driveruid,
|
||||
td.d_createruid,
|
||||
td.d_status
|
||||
FROM
|
||||
tbl_daily) td
|
||||
tbl_daily td
|
||||
LEFT OUTER JOIN tbl_request tr
|
||||
ON td.d_ruid = tr.r_uid) td
|
||||
WHERE
|
||||
tc.c_uid = td.d_customeruid
|
||||
AND td.d_driveruid = ".(int)$_POST['driver']."
|
||||
|
|
@ -190,6 +196,8 @@ class API extends CONF {
|
|||
"last_pickup_date" => $rstOptionPoint['c_lastpickupdate'],
|
||||
"last_paid_date" => $rstOptionPoint['c_lastpaiddate'],
|
||||
"duid" => $rstOptionPoint['d_uid'],
|
||||
"druid" => $rstOptionPoint['d_ruid'],
|
||||
"rnote" => $rstOptionPoint['r_note'],
|
||||
"orderFlag" => $orderFlag
|
||||
);
|
||||
if(strlen($uidList) > 0){
|
||||
|
|
@ -943,6 +951,7 @@ class API extends CONF {
|
|||
|
||||
try {
|
||||
$sqShortInfo = qry("SELECT
|
||||
c_name,
|
||||
c_paymenttype,
|
||||
c_comment_ri,
|
||||
c_location
|
||||
|
|
@ -984,6 +993,7 @@ class API extends CONF {
|
|||
|
||||
$result = array(
|
||||
"id" => $_POST['id'],
|
||||
"name" => $rstShortInfo['c_name'],
|
||||
"payment_type" => $rstShortInfo['c_paymenttype'],
|
||||
"paymentstring" => $d_paystatusSTR,
|
||||
"comment" => $rstShortInfo['c_comment_ri'],
|
||||
|
|
|
|||
|
|
@ -404,9 +404,15 @@ function popup(){
|
|||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="td-title-info">Sludge</td>
|
||||
<td class="td-title-info">Sludge (%)</td>
|
||||
<td class="td-text-info">
|
||||
<input type="text" class="d_sludge" placeholder="50">
|
||||
|
||||
<div class="number-input">
|
||||
<button class="left" type="button">▼</button>
|
||||
<input type="number" class="d_sludge" value="50" min="0" max="100" placeholder="50">
|
||||
<button class="right" type="button">▲</button>
|
||||
</div>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
|
|
@ -598,6 +604,10 @@ function popup(){
|
|||
<input type="hidden" name="mode" class="mode" value="update">
|
||||
<table class="tb-info-box">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="td-title-info">Restaurant Name</td>
|
||||
<td class="td-text-info shortinfo-store-name">Name</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="td-title-info">Payment Type</td>
|
||||
<td class="td-text-info shortinfo-payment-type">Cheque</td>
|
||||
|
|
@ -1639,6 +1649,8 @@ function popup(){
|
|||
lastPickupDate: json.result[i]['last_pickup_date'],
|
||||
lastPaidDate: json.result[i]['last_paid_date'],
|
||||
duid: json.result[i]['duid'],
|
||||
druid: json.result[i]['druid'],
|
||||
rnote: json.result[i]['rnote'],
|
||||
|
||||
<? if ($_SESSION['ss_LEVEL'] == 9) { ?>
|
||||
orderFlag: json.result[i]['orderFlag']
|
||||
|
|
@ -1970,7 +1982,7 @@ function popup(){
|
|||
}
|
||||
|
||||
function showShortInfo(id){
|
||||
|
||||
|
||||
let loadingTxt = 'Loading...';
|
||||
jQuery("#customerShortInfo .shortinfo-payment-type").text(loadingTxt);
|
||||
jQuery("#customerShortInfo #c_comment_ri,#customerShortInfo #c_location").val(loadingTxt).attr("disabled","disabled");
|
||||
|
|
@ -1986,6 +1998,7 @@ function popup(){
|
|||
|
||||
var rstInqShortInfo = function(json) {
|
||||
jQuery("#customerShortInfo .c_uid").val(json.result['id']);
|
||||
jQuery("#customerShortInfo .shortinfo-store-name").text(json.result['name']);
|
||||
jQuery("#customerShortInfo .shortinfo-payment-type").text(json.result['payment_type']);
|
||||
jQuery("#customerShortInfo .shortinfo-payment-string").text(json.result['paymentstring']);
|
||||
jQuery("#customerShortInfo #c_comment_ri").val(json.result['comment']).attr("disabled",false);
|
||||
|
|
@ -2126,7 +2139,7 @@ function popup(){
|
|||
<td class="td-text-info">
|
||||
<span>${property.rate}</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="td-title-info">Phone</td>
|
||||
|
|
@ -2134,20 +2147,6 @@ function popup(){
|
|||
<span>${property.phone}</span>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="td-title-info">Address</td>
|
||||
<td class="td-text-info">
|
||||
<a
|
||||
href="https://www.google.com/maps?q=${encodeURIComponent(property.address)}"
|
||||
target="_blank"
|
||||
style="color: inherit; text-decoration: underline; cursor: pointer;"
|
||||
>
|
||||
<span>${property.address}</span>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="td-title-info">Forecast</td>
|
||||
<td class="td-text-info">
|
||||
|
|
@ -2167,20 +2166,32 @@ function popup(){
|
|||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="address-row">
|
||||
<div class="address-title">Address</div>
|
||||
<div class="address-content">
|
||||
<a href="https://maps.google.com/?q=${encodeURIComponent(property.address)}"
|
||||
class="address-link"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer">
|
||||
${property.address}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<div class="text-center map-grid-layout-col-3">
|
||||
<button type="button" class="mapBtn btn-info-modal" onClick="javscript:showShortInfo(${property.customerid});" data-toggle="modal" data-target="#map-modal-info"><i class="fa-solid fa-question"></i><br>Info</button>
|
||||
<button type="submit" class="mapBtn btn-grey-modal" onClick="javascript:initHistory(${property.customerid});" data-toggle="modal" data-target="#map-modal-history"><i class="bi bi-folder2-open"></i><br>History</button>`;
|
||||
if(`${property.date}` === 'null') {
|
||||
innerHtml += `<button type="button" class="mapBtn btn-primary-modal addOrderBtn_${property.index}" data-toggle="modal" onClick="javascript:initAddOrder(${property.customerid},${property.index});"><i class="fa-solid fa-plus"></i><br>Add Order</button>`;
|
||||
innerHtml += `<button type="button" class="mapBtn btn-red-modal hidden removeOrderBtn_${property.index}" data-toggle="modal" data-target="#modal-confirm" onClick="javascript:removeOrder(${property.customerid},${property.duid},${property.index});"><i class="fa-solid fa-xmark"></i><br>Remove Order</button>`;
|
||||
innerHtml += `<button type="button" class="mapBtn btn-primary-modal addOrderBtn_${property.index}" data-toggle="modal" onClick="javascript:initAddOrder(${property.customerid},${property.index});"><i class="fa-solid fa-plus"></i><br>Add</button>`;
|
||||
innerHtml += `<button type="button" class="mapBtn btn-red-modal hidden removeOrderBtn_${property.index}" data-toggle="modal" data-target="#modal-confirm" onClick="javascript:removeOrder(${property.customerid},${property.duid},${property.index});"><i class="fa-solid fa-xmark"></i><br>Remove</button>`;
|
||||
}else{
|
||||
innerHtml += `<button type="button" class="mapBtn btn-primary-modal addOrderBtn_${property.index} hidden" data-toggle="modal" onClick="javascript:initAddOrder(${property.customerid},${property.index});"><i class="fa-solid fa-plus"></i><br>Add Order</button>`;
|
||||
innerHtml += `<button type="button" ${property.orderFlag} class="mapBtn btn-red-modal removeOrderBtn_${property.index}" data-toggle="modal" data-target="#modal-confirm" onClick="javascript:removeOrder(${property.customerid},${property.duid},${property.index});"><i class="fa-solid fa-xmark"></i><br>Remove Order</button>`;
|
||||
innerHtml += `<button type="button" class="mapBtn btn-primary-modal addOrderBtn_${property.index} hidden" data-toggle="modal" onClick="javascript:initAddOrder(${property.customerid},${property.index});"><i class="fa-solid fa-plus"></i><br>Add</button>`;
|
||||
innerHtml += `<button type="button" ${property.orderFlag} class="mapBtn btn-red-modal removeOrderBtn_${property.index}" data-toggle="modal" data-target="#modal-confirm" onClick="javascript:removeOrder(${property.customerid},${property.duid},${property.index});"><i class="fa-solid fa-xmark"></i><br>Remove</button>`;
|
||||
}
|
||||
innerHtml += `<button type="submit" class="mapBtn btn-nearby" onClick="javascript:inqNearby('${property.lat}:${property.lon}');"><i class="fa-solid fa-diamond-turn-right"></i><br>Nearby</button>
|
||||
<button type="submit" class="mapBtn btn-orange-modal" data-toggle="modal" data-target="#map-modal-note" onClick="javscript:showShortNotice(${property.duid});"><i class="fa fa-thumb-tack"></i><br>Notice</button>
|
||||
<button type="submit" class="mapBtn btn-orange-modal ${(property.rnote !== null && property.rnote.trim() !== '') ? 'blink' : '' }" data-toggle="modal" data-target="#map-modal-note" onClick="javscript:showShortNotice(${property.duid});"><i class="fa fa-thumb-tack"></i><br>Notice</button>
|
||||
<button type="submit" class="mapBtn btn-purple-modal" data-toggle="modal" data-target="#map-modal-input" onClick="javascript:initInput(${property.customerid});"><i class="bi bi-truck"></i><br>Input</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -2205,4 +2216,27 @@ function popup(){
|
|||
jQuery(".loading-overlay").css("display","none");
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
document.querySelectorAll('.number-input').forEach(container => {
|
||||
const input = container.querySelector('.d_sludge');
|
||||
const leftBtn = container.querySelector('.left');
|
||||
const rightBtn = container.querySelector('.right');
|
||||
const step = 5;
|
||||
|
||||
leftBtn.addEventListener('click', () => {
|
||||
const min = input.min ? parseInt(input.min) : -Infinity;
|
||||
let value = parseInt(input.value || 0);
|
||||
if (value - step >= min) input.value = value - step;
|
||||
});
|
||||
|
||||
rightBtn.addEventListener('click', () => {
|
||||
const max = input.max ? parseInt(input.max) : Infinity;
|
||||
let value = parseInt(input.value || 0);
|
||||
if (value + step <= max) input.value = value + step;
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Loading…
Reference in New Issue