Map: Header, Button, Link

This commit is contained in:
Jaeeun.Cho 2025-10-30 09:24:47 -04:00
parent 5521ca934d
commit d3b760fbf2
4 changed files with 143 additions and 52 deletions

View File

@ -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

View File

@ -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 {

View File

@ -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'],

View File

@ -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']
@ -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);
@ -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>
@ -2206,3 +2217,26 @@ function popup(){
}
</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>