This commit is contained in:
meusinfirmary
2025-06-12 01:13:36 +07:00
parent a38ebbb30f
commit bd78b881b5
18 changed files with 528 additions and 713 deletions

View File

@ -3,11 +3,8 @@
Edit Zone
@endsection
@section('customcss')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css"
integrity="sha512-gc3xjCmIy673V6MyOAZhIW93xhM9ei1I+gLbmFjUHIjocENRsLX/QUE1htk5q1XV2D/iie/VQ8DXI6Vu8bexvQ=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vanilla-picker@2.12.1/dist/vanilla-picker.csp.css"
integrity="sha256-ITHmamcImsZ/Je1xrdtDLZVvRSpj1Zokb6uHXORB824=" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css" integrity="sha512-gc3xjCmIy673V6MyOAZhIW93xhM9ei1I+gLbmFjUHIjocENRsLX/QUE1htk5q1XV2D/iie/VQ8DXI6Vu8bexvQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vanilla-picker@2.12.1/dist/vanilla-picker.csp.css" integrity="sha256-ITHmamcImsZ/Je1xrdtDLZVvRSpj1Zokb6uHXORB824=" crossorigin="anonymous">
@endsection
@section('content')
<div class="container-fluid">
@ -24,18 +21,15 @@
<h6>Zone Infomation</h6>
<div class="mb-3">
<label for="edt-zone_name" class="form-label">Name</label>
<input type="text" class="form-control form-control-sm" name="edt-zone_name"
id="edt-zone_name" value="{{ $zone->name }}">
<input type="text" class="form-control form-control-sm" name="edt-zone_name" id="edt-zone_name" value="{{ $zone->name }}">
</div>
@if ($is_su)
<div class="mb-3">
<label for="edt-zone_client" class="form-label">Client</label>
<select name="edt-zone_client" id="edt-zone_client"
class="form-control select2">
<label for="edt-zone_client" class="form-label">Company</label>
<select name="edt-zone_client" id="edt-zone_client" class="form-control select2">
<option value="">Choose</option>
@foreach ($clients as $client)
<option value="{{ $client->id }}"
{{ $zone->client_group_id == $client->id ? 'selected' : '' }}>
<option value="{{ $client->id }}" {{ $zone->client_group_id == $client->id ? 'selected' : '' }}>
{{ $client->name }}</option>
@endforeach
</select>
@ -46,8 +40,7 @@
<select name="edt-zone_type" id="edt-zone_type" class="form-control select2">
<option value="">Choose</option>
@foreach ($types as $type)
<option value="{{ $type->id }}"
{{ $zone->type == $type->id ? 'selected' : '' }}>{{ $type->name }}
<option value="{{ $type->id }}" {{ $zone->type == $type->id ? 'selected' : '' }}>{{ $type->name }}
</option>
@endforeach
</select>
@ -55,71 +48,59 @@
<div class="mb-3">
<label for="edt-workflow_zone_type" class="form-label">Workflow Zone
Type</label>
<select name="edt-workflow_zone_type" id="edt-workflow_zone_type"
class="form-control select2">
<select name="edt-workflow_zone_type" id="edt-workflow_zone_type" class="form-control select2">
<option value="">Choose</option>
@foreach ($workflows as $workflow)
<option value="{{ $workflow->id }}"
{{ $zone->workflow_type == $workflow->id ? 'selected' : '' }}>
<option value="{{ $workflow->id }}" {{ $zone->workflow_type == $workflow->id ? 'selected' : '' }}>
{{ $workflow->name }}</option>
@endforeach
</select>
</div>
<div class="mb-3">
{{-- <div class="mb-3">
<label for="edt-shiptocode" class="form-label">Ship-To Code</label>
<input type="number" class="form-control form-control-sm" name="edt-shiptocode"
id="edt-shiptocode" placeholder="postcode" value="{{ $zone->shiptocode }}">
<input type="number" class="form-control form-control-sm" name="edt-shiptocode" id="edt-shiptocode" placeholder="postcode" value="{{ $zone->shiptocode }}">
</div>
<div class="mb-3">
<label for="edt-prid" class="form-label">Province</label>
<select class="form-control form-control-sm select2" name="edt-prid"
id="edt-prid">
<select class="form-control form-control-sm select2" name="edt-prid" id="edt-prid">
<option value="">Select Province</option>
@foreach ($provs as $prov)
<option value="{{ $prov->kodeProv }}"
{{ $zone->prid == $prov->kodeProv ? 'selected' : '' }}>
<option value="{{ $prov->kodeProv }}" {{ $zone->prid == $prov->kodeProv ? 'selected' : '' }}>
{{ $prov->nmProvinsiKel }}</option>
@endforeach
</select>
</div>
<div class="mb-3">
<label for="edt-ktid" class="form-label">City</label>
<select class="form-control form-control-sm select2" name="edt-ktid"
id="edt-ktid">
<select class="form-control form-control-sm select2" name="edt-ktid" id="edt-ktid">
<option value="">Select City</option>
<option value="{{ $zone->ktid }}" selected>{{ $zone->ktid_name }}</option>
</select>
</div>
<div class="mb-3">
<label for="edt-kcid" class="form-label">District</label>
<select class="form-control form-control-sm select2" name="edt-kcid"
id="edt-kcid">
<select class="form-control form-control-sm select2" name="edt-kcid" id="edt-kcid">
<option value="">Select District</option>
<option value="{{ $zone->kcid }}" selected>{{ $zone->kcid_name }}</option>
</select>
</div>
<div class="mb-3">
<label for="edt-klid" class="form-label">Village</label>
<select class="form-control form-control-sm select2" name="edt-klid"
id="edt-klid">
<select class="form-control form-control-sm select2" name="edt-klid" id="edt-klid">
<option value="">Select Village</option>
<option value="{{ $zone->klid }}" selected>{{ $zone->klid_name }}</option>
</select>
</div>
</div> --}}
<div class="mb-4">
<label for="edt-fulladdress" class="form-label">Address</label>
<textarea name="edt-fulladdress" id="edt-fulladdress"
class="form-control form-control-sm"
rows="3">{{ $zone->fulladdress }}</textarea>
<textarea name="edt-fulladdress" id="edt-fulladdress" class="form-control form-control-sm" rows="3">{{ $zone->fulladdress }}</textarea>
</div>
<h6>Utilities</h6>
<div class="mb-4">
<label for="edt-status" class="form-label">Zone Status</label>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="edt-status"
{{ $zone->status == App\Models\Zone::STATUS_ACTIVE ? 'checked' : '' }}>
<label class="form-check-label" for="edt-status"><span class="text-dark"
id="edt-txtStatus">Inactive</span></label>
<input class="form-check-input" type="checkbox" id="edt-status" {{ $zone->status == App\Models\Zone::STATUS_ACTIVE ? 'checked' : '' }}>
<label class="form-check-label" for="edt-status"><span class="text-dark" id="edt-txtStatus">Inactive</span></label>
</div>
</div>
</div>
@ -130,15 +111,11 @@
<div class="col-3">
<label for="edt-boundary_color" class="form-label">Boundary
Color</label>
<input type="color" class="form-control form-control-sm"
name="edt-boundary_color" id="edt-boundary_color"
placeholder="hex codes" value="{{ $zone->boundary_hex_color }}">
<input type="color" class="form-control form-control-sm" name="edt-boundary_color" id="edt-boundary_color" placeholder="hex codes" value="{{ $zone->boundary_hex_color }}">
</div>
<div class="col-9">
<label for="edt-boundary_hex" class="form-label">&nbsp;</label>
<input type="text" class="form-control form-control-sm"
name="edt-boundary_hex" id="edt-boundary_hex" placeholder="hex codes"
value="{{ $zone->boundary_hex_color }}">
<input type="text" class="form-control form-control-sm" name="edt-boundary_hex" id="edt-boundary_hex" placeholder="hex codes" value="{{ $zone->boundary_hex_color }}">
</div>
</div>
</div>
@ -146,15 +123,15 @@
<div class="row">
<div class="col-6">
<label for="edt-boundary_type" class="form-label">Boundary Type</label>
<select id="edt-boundary_type" name="edt-boundary_type"
class="form-control select2">
<select id="edt-boundary_type" name="edt-boundary_type" class="form-control select2">
<option value="">Choose</option>
@foreach ($boundarys as $boundary)
@php
if ($boundary['id'] == \App\Models\Zone::ZONE_BOUNDARY_POLYGON) continue;
if ($boundary['id'] == \App\Models\Zone::ZONE_BOUNDARY_POLYGON) {
continue;
}
@endphp
<option value="{{ $boundary['id'] }}"
{{ $zone->boundary_type == $boundary['id'] ? 'selected' : '' }}> {{ $boundary['name'] }}
<option value="{{ $boundary['id'] }}" {{ $zone->boundary_type == $boundary['id'] ? 'selected' : '' }}> {{ $boundary['name'] }}
</option>
@endforeach
</select>
@ -162,18 +139,15 @@
<div class="edt-group_boundary_circle col-6 mb-3 {{ $zone->boundary_radius ? '' : 'd-none' }}">
<label for="edt-boundary_radius" class="form-label">Radius
(meter)</label>
<input type="text" class="form-control form-control-sm"
name="edt-boundary_radius" id="edt-boundary_radius" value="{{ $zone->boundary_radius }}">
<input type="text" class="form-control form-control-sm" name="edt-boundary_radius" id="edt-boundary_radius" value="{{ $zone->boundary_radius }}">
</div>
<div class="edt-group_boundary_circle col-6 {{ $zone->boundary_radius ? '' : 'd-none' }}">
<label for="edt-boundary_lat" class="form-label">Latitude</label>
<input type="text" class="form-control form-control-sm"
name="edt-boundary_lat" id="edt-boundary_lat">
<input type="text" class="form-control form-control-sm" name="edt-boundary_lat" id="edt-boundary_lat">
</div>
<div class="edt-group_boundary_circle col-6 {{ $zone->boundary_radius ? '' : 'd-none' }}">
<label for="edt-boundary_lng" class="form-label">Longitude</label>
<input type="text" class="form-control form-control-sm"
name="edt-boundary_lng" id="edt-boundary_lng">
<input type="text" class="form-control form-control-sm" name="edt-boundary_lng" id="edt-boundary_lng">
</div>
</div>
</div>
@ -192,8 +166,7 @@
</div>
</div>
<div class="modal fade" id="delZoneModal" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false"
aria-labelledby="delZoneModal" aria-hidden="true">
<div class="modal fade" id="delZoneModal" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false" aria-labelledby="delZoneModal" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-sm">
<div class="modal-content">
<div class="modal-header">
@ -222,11 +195,8 @@
@section('customjs')
<script src="{{ asset('assets/vendor/leaflet-1.7.1/leaflet-src.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"
integrity="sha512-ozq8xQKq6urvuU6jNgkfqAmT7jKN2XumbrX1JiB3TnF7tI48DPI4Gy1GXKD/V3EExgAs1V+pRO7vwtS1LHg0Gw=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdn.jsdelivr.net/npm/vanilla-picker@2.12.1/dist/vanilla-picker.min.js"
integrity="sha256-V1zh/sQiwo4NO4mg4WqQF9j79hDt7MBbTi3klxV3ZK4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js" integrity="sha512-ozq8xQKq6urvuU6jNgkfqAmT7jKN2XumbrX1JiB3TnF7tI48DPI4Gy1GXKD/V3EExgAs1V+pRO7vwtS1LHg0Gw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdn.jsdelivr.net/npm/vanilla-picker@2.12.1/dist/vanilla-picker.min.js" integrity="sha256-V1zh/sQiwo4NO4mg4WqQF9j79hDt7MBbTi3klxV3ZK4=" crossorigin="anonymous"></script>
<script>
'use strict'
@ -884,18 +854,19 @@
name: '',
fulladdress: '',
boundary_radius: Number(rad),
boundary_latlngs: [
{
lat: lat,
lng: lng,
},
],
boundary_latlngs: [{
lat: lat,
lng: lng,
}, ],
boundary_bounds: '',
boundary_type: State.boundary_type.circle,
createDrawToolbar: State.createDrawToolbar,
};
Leaflet.injectShapeToLDraw(obj);
ZUpdt.toggleInputCircle(true, rad, {lat, lng});
ZUpdt.toggleInputCircle(true, rad, {
lat,
lng
});
}
let radTimeout = null;
$('#edt-boundary_radius').on('keyup', function() {
@ -975,18 +946,23 @@
// https://gist.github.com/takvol/f4288261fba112030fb0fbfe11724f04
if (data.boundary_type == State.boundary_type.circle) {
data.boundary_diameter = data.boundary_radius * 2;
data.boundary_area = 0; data.boundary_ha = 0;
data.boundary_area = 0;
data.boundary_ha = 0;
} else if (data.boundary_type == State.boundary_type.rectangle) {
data.boundary_radius = 0; data.boundary_diameter = 0;
data.boundary_radius = 0;
data.boundary_diameter = 0;
data.boundary_area = L.GeometryUtil.geodesicArea(data.boundary_latlngs); // in square meter
data.boundary_ha = L.GeometryUtil.readableArea(data.boundary_area, true).replace(' ha', ''); // in ha
} else if (data.boundary_type == State.boundary_type.polygon) {
data.boundary_radius = 0; data.boundary_diameter = 0;
data.boundary_radius = 0;
data.boundary_diameter = 0;
data.boundary_area = L.GeometryUtil.geodesicArea(data.boundary_latlngs); // in square meter
data.boundary_ha = L.GeometryUtil.readableArea(data.boundary_area, true).replace(' ha', ''); // in ha
} else {
data.boundary_radius = 0; data.boundary_diameter = 0;
data.boundary_area = 0; data.boundary_ha = 0;
data.boundary_radius = 0;
data.boundary_diameter = 0;
data.boundary_area = 0;
data.boundary_ha = 0;
}
if ($('#edt-status').prop('checked')) {
@ -1066,7 +1042,10 @@
lng: e.layer._latlng.lng,
}];
State.boundary_radius = e.layer._mRadius;
ZUpdt.toggleInputCircle(true, State.boundary_radius, {lat: e.layer._latlng.lat, lng: e.layer._latlng.lng});
ZUpdt.toggleInputCircle(true, State.boundary_radius, {
lat: e.layer._latlng.lat,
lng: e.layer._latlng.lng
});
} else if (e.layerType == State.boundary_type.polygon) {
State.boundary_type_choose = State.boundary_type.polygon;
State.boundary_latlngs = [];
@ -1146,7 +1125,7 @@
ZDel.submitData(data);
});
// on view update
$('#btnDelZone_updt').on('click', function (e) {
$('#btnDelZone_updt').on('click', function(e) {
let data = ZUpdt.getData();
ZDel.passDataToView({
zid: data.zid,