mirror of
https://github.com/Freika/dawarich.git
synced 2026-01-10 17:21:38 -05:00
Rework settings pages
This commit is contained in:
Eugene Burmakin
parent
06aee05602
commit
5688d66972
10 changed files with 185 additions and 87 deletions
|
|
@ -37,7 +37,7 @@ class MapController < ApplicationController
|
|||
|
||||
@coordinates.each_cons(2) do
|
||||
@distance += Geocoder::Calculations.distance_between(
|
||||
[_1[0], _1[1]], [_2[0], _2[1]], units: current_user.safe_settings.distance_unit
|
||||
[_1[0], _1[1]], [_2[0], _2[1]], units: current_user.safe_settings.distance_unit.to_sym
|
||||
)
|
||||
end
|
||||
|
||||
|
|
|
|||
|
|
@ -24,6 +24,6 @@ class Settings::MapsController < ApplicationController
|
|||
private
|
||||
|
||||
def settings_params
|
||||
params.require(:maps).permit(:name, :url)
|
||||
params.require(:maps).permit(:name, :url, :distance_unit)
|
||||
end
|
||||
end
|
||||
|
|
|
|||
|
|
@ -31,7 +31,8 @@ class SettingsController < ApplicationController
|
|||
params.require(:settings).permit(
|
||||
:meters_between_routes, :minutes_between_routes, :fog_of_war_meters,
|
||||
:time_threshold_minutes, :merge_threshold_minutes, :route_opacity,
|
||||
:immich_url, :immich_api_key, :photoprism_url, :photoprism_api_key
|
||||
:immich_url, :immich_api_key, :photoprism_url, :photoprism_api_key,
|
||||
:distance_unit
|
||||
)
|
||||
end
|
||||
end
|
||||
|
|
|
|||
|
|
@ -25,7 +25,9 @@ class Visit < ApplicationRecord
|
|||
return area&.radius if area.present?
|
||||
|
||||
radius = points.map do |point|
|
||||
Geocoder::Calculations.distance_between(center, [point.lat, point.lon])
|
||||
Geocoder::Calculations.distance_between(
|
||||
center, [point.lat, point.lon], units: user.safe_settings.distance_unit.to_sym
|
||||
)
|
||||
end.max
|
||||
|
||||
radius && radius >= 15 ? radius : 15
|
||||
|
|
|
|||
|
|
@ -93,6 +93,6 @@ class Users::SafeSettings
|
|||
end
|
||||
|
||||
def distance_unit
|
||||
settings['distance_unit'] || 'km'
|
||||
settings['maps']['distance_unit'] || 'km'
|
||||
end
|
||||
end
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<div role="tablist" class="tabs tabs-lifted tabs-lg">
|
||||
<%= link_to 'Integrations', settings_path, role: 'tab', class: "tab #{active_tab?(settings_path)}" %>
|
||||
<div class="tabs tabs-boxed mb-6">
|
||||
<%= link_to 'Integrations', settings_path, role: 'tab', class: "tab tab-lg #{active_tab?(settings_path)}" %>
|
||||
<% if DawarichSettings.self_hosted? && current_user.admin? %>
|
||||
<%= link_to 'Users', settings_users_path, role: 'tab', class: "tab #{active_tab?(settings_users_path)}" %>
|
||||
<%= link_to 'Background Jobs', settings_background_jobs_path, role: 'tab', class: "tab #{active_tab?(settings_background_jobs_path)}" %>
|
||||
<%= link_to 'Users', settings_users_path, role: 'tab', class: "tab tab-lg #{active_tab?(settings_users_path)}" %>
|
||||
<%= link_to 'Background Jobs', settings_background_jobs_path, role: 'tab', class: "tab tab-lg #{active_tab?(settings_background_jobs_path)}" %>
|
||||
<% end %>
|
||||
<%= link_to 'Map', settings_maps_path, role: 'tab', class: "tab #{active_tab?(settings_maps_path)}" %>
|
||||
<%= link_to 'Map', settings_maps_path, role: 'tab', class: "tab tab-lg #{active_tab?(settings_maps_path)}" %>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,9 @@
|
|||
<% content_for :title, "Background jobs" %>
|
||||
|
||||
<div class="min-h-content w-full my-5">
|
||||
<h1 class="text-3xl font-bold mb-6">Background jobs</h1>
|
||||
<%= render 'settings/navigation' %>
|
||||
|
||||
<div class="flex justify-between items-center mt-5">
|
||||
<h1 class="font-bold text-4xl">Background jobs</h1>
|
||||
</div>
|
||||
|
||||
<div role="alert" class="alert m-5">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
|
|
|
|||
|
|
@ -1,34 +1,78 @@
|
|||
<% content_for :title, 'Settings' %>
|
||||
|
||||
<div class="min-h-content w-full my-5">
|
||||
<h1 class="text-3xl font-bold mb-6">User Settings</h1>
|
||||
<%= render 'settings/navigation' %>
|
||||
|
||||
<div class="flex flex-col lg:flex-row w-full my-10 space-x-4">
|
||||
<div class="card flex-shrink-0 w-full max-w-sm shadow-2xl bg-base-100 px-5 py-5 mx-5">
|
||||
<h2 class="text-2xl font-bold">Edit your Integrations settings!</h1>
|
||||
<%= form_for :settings, url: settings_path, method: :patch, data: { turbo_method: :patch, turbo: false } do |f| %>
|
||||
<div class="form-control my-2">
|
||||
<%= f.label :immich_url %>
|
||||
<%= f.text_field :immich_url, value: current_user.safe_settings.immich_url, class: "input input-bordered", placeholder: 'http://192.168.0.1:2283' %>
|
||||
<div class="card bg-base-200 shadow-xl">
|
||||
<%= form_for :settings, url: settings_path, method: :patch, data: { turbo_method: :patch, turbo: false } do |f| %>
|
||||
<div class="card-body">
|
||||
<div class="space-y-8 animate-fade-in">
|
||||
<div>
|
||||
<h2 class="text-2xl font-bold mb-4 flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-camera mr-2 text-primary">
|
||||
<path d="M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z"></path>
|
||||
<circle cx="12" cy="13" r="3"></circle>
|
||||
</svg>Immich Integration
|
||||
</h2>
|
||||
<div class="bg-base-100 p-5 rounded-lg shadow-sm space-y-4">
|
||||
<div class="form-control w-full">
|
||||
<%= f.label :immich_url, class: 'label' do %>
|
||||
<span class="label-text font-medium">Immich URL</span>
|
||||
<% end %>
|
||||
<%= f.url_field :immich_url, value: current_user.safe_settings.immich_url, class: "input input-bordered w-full pr-10", placeholder: 'http://192.168.0.1:2283' %>
|
||||
<span class="label-text-alt mt-1">The base URL of your Immich instance</span>
|
||||
</div>
|
||||
<div class="form-control w-full">
|
||||
<%= f.label :immich_api_key, class: 'label' do %>
|
||||
<span class="label-text font-medium">Immich API Key</span>
|
||||
<% end %>
|
||||
<div class="relative">
|
||||
<%= f.password_field :immich_api_key, value: current_user.safe_settings.immich_api_key, class: "input input-bordered w-full pr-10", placeholder: 'xxxxxxxxxxxxxx' %>
|
||||
</div>
|
||||
<span class="label-text-alt mt-1">Found in your Immich admin panel under API settings</span>
|
||||
</div>
|
||||
<%# <div class="flex justify-end">
|
||||
<button class="btn btn-sm btn-outline">Test Connection</button>
|
||||
</div> %>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="text-2xl font-bold mb-4 flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-camera mr-2 text-primary">
|
||||
<path d="M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z"></path>
|
||||
<circle cx="12" cy="13" r="3"></circle>
|
||||
</svg>Photoprism Integration
|
||||
</h2>
|
||||
<div class="bg-base-100 p-5 rounded-lg shadow-sm space-y-4">
|
||||
<div class="form-control w-full">
|
||||
<%= f.label :photoprism_url, class: 'label' do %>
|
||||
<span class="label-text font-medium">Photoprism URL</span>
|
||||
<% end %>
|
||||
<div class="relative">
|
||||
<%= f.url_field :photoprism_url, value: current_user.safe_settings.photoprism_url, class: "input input-bordered w-full pr-10", placeholder: 'http://192.168.0.1:2342' %>
|
||||
</div>
|
||||
<span class="label-text-alt mt-1">The base URL of your Photoprism instance</span>
|
||||
</div>
|
||||
<div class="form-control w-full">
|
||||
<%= f.label :photoprism_api_key, class: 'label' do %>
|
||||
<span class="label-text font-medium">Photoprism API Key</span>
|
||||
<% end %>
|
||||
<div class="relative">
|
||||
<%= f.password_field :photoprism_api_key, value: current_user.safe_settings.photoprism_api_key, class: "input input-bordered w-full pr-10", placeholder: 'xxxxxxxxxxxxxx' %>
|
||||
</div>
|
||||
<span class="label-text-alt mt-1">Found in your Photoprism settings under Library</span>
|
||||
</div>
|
||||
<%# <div class="flex justify-end">
|
||||
<button class="btn btn-sm btn-outline">Test Connection</button>
|
||||
</div> %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-control my-2">
|
||||
<%= f.label :immich_api_key %>
|
||||
<%= f.text_field :immich_api_key, value: current_user.safe_settings.immich_api_key, class: "input input-bordered", placeholder: 'xxxxxxxxxxxxxx' %>
|
||||
<div class="card-actions justify-end mt-6">
|
||||
<%= f.submit "Save changes", class: "btn btn-primary" %>
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
<div class="form-control my-2">
|
||||
<%= f.label :photoprism_url %>
|
||||
<%= f.text_field :photoprism_url, value: current_user.safe_settings.photoprism_url, class: "input input-bordered", placeholder: 'http://192.168.0.1:2342' %>
|
||||
</div>
|
||||
<div class="form-control my-2">
|
||||
<%= f.label :photoprism_api_key %>
|
||||
<%= f.text_field :photoprism_api_key, value: current_user.safe_settings.photoprism_api_key, class: "input input-bordered", placeholder: 'xxxxxxxxxxxxxx' %>
|
||||
</div>
|
||||
|
||||
<div class="form-control my-2">
|
||||
<%= f.submit "Update", class: "btn btn-primary" %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,9 @@
|
|||
<% content_for :title, "Map settings" %>
|
||||
|
||||
<div class="min-h-content w-full my-5">
|
||||
<h1 class="text-3xl font-bold mb-6">Map settings</h1>
|
||||
<%= render 'settings/navigation' %>
|
||||
|
||||
<div class="flex justify-between items-center my-5">
|
||||
<h1 class="font-bold text-4xl">Maps settings</h1>
|
||||
</div>
|
||||
|
||||
<div role="alert" class="alert alert-info">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
|
|
@ -22,50 +19,106 @@
|
|||
<span>Please remember, that using a custom tile URL may result in extra costs. Check your map tile provider's terms of service for more information.</span>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4 mt-5" data-controller="map-preview">
|
||||
<div class="flex flex-col gap-4">
|
||||
<%= form_for :maps,
|
||||
url: settings_maps_path,
|
||||
method: :patch,
|
||||
autocomplete: "off",
|
||||
data: { turbo_method: :patch, turbo: false } do |f| %>
|
||||
<div class="form-control my-2">
|
||||
<%= f.label :name %>
|
||||
<%= f.text_field :name, value: @maps['name'], placeholder: 'Example: OpenStreetMap', class: "input input-bordered" %>
|
||||
<div class="card bg-base-200 shadow-xl">
|
||||
<%= form_for :maps,
|
||||
url: settings_maps_path,
|
||||
method: :patch,
|
||||
autocomplete: "off",
|
||||
data: { turbo_method: :patch, turbo: false } do |f| %>
|
||||
|
||||
<div class="card-body">
|
||||
<div class="space-y-8 animate-fade-in">
|
||||
<div>
|
||||
<h2 class="text-2xl font-bold mb-4 flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map mr-2 text-primary">
|
||||
<polygon points="3 6 9 3 15 6 21 3 21 18 15 21 9 18 3 21"></polygon>
|
||||
<line x1="9" x2="9" y1="3" y2="18"></line>
|
||||
<line x1="15" x2="15" y1="6" y2="21"></line>
|
||||
</svg>Map Configuration
|
||||
</h2>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6" data-controller="map-preview">
|
||||
<div class="bg-base-100 p-5 rounded-lg shadow-sm space-y-4">
|
||||
<div class="form-control w-full">
|
||||
<%= f.label :name, class: 'label' do %>
|
||||
<span class="label-text font-medium">Map Name</span>
|
||||
<% end %>
|
||||
<div class="relative">
|
||||
<%= f.text_field :name, value: @maps['name'], placeholder: 'Example: OpenStreetMap', class: "input input-bordered w-full pr-10" %>
|
||||
</div>
|
||||
<span class="label-text-alt mt-1">A descriptive name for your map configuration</span>
|
||||
</div>
|
||||
<div class="form-control w-full">
|
||||
<%= f.label :url, class: 'label' do %>
|
||||
<span class="label-text font-medium">Tile URL</span>
|
||||
<% end %>
|
||||
<div class="relative">
|
||||
<%= f.text_field :url,
|
||||
value: @maps['url'],
|
||||
autocomplete: "off",
|
||||
placeholder: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||||
class: "input input-bordered w-full pr-10",
|
||||
data: {
|
||||
map_preview_target: "urlInput",
|
||||
action: "input->map-preview#updatePreview"
|
||||
} %>
|
||||
</div>
|
||||
<span class="label-text-alt mt-1">URL pattern for map tiles. Must include {x}, {y}, and {z} placeholders</span>
|
||||
</div>
|
||||
<div class="form-control">
|
||||
<label class="label cursor-pointer justify-start">
|
||||
<span class="label-text mr-4 flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe mr-2 w-4 h-4">
|
||||
<circle cx="12" cy="12" r="10"></circle>
|
||||
<path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path>
|
||||
<path d="M2 12h20"></path>
|
||||
</svg>Distance Unit </span>
|
||||
<div class="flex items-center space-x-2">
|
||||
<%= f.label :distance_unit_km, 'Kilometers', class: 'cursor-pointer' %>
|
||||
<%= f.radio_button :distance_unit, 'km', id: 'maps_distance_unit_km', class: 'radio radio-primary ml-1 mr-4', checked: @maps['distance_unit'] == 'km' %>
|
||||
<%= f.label :distance_unit_mi, 'Miles', class: 'cursor-pointer' %>
|
||||
<%= f.radio_button :distance_unit, 'mi', id: 'maps_distance_unit_mi', class: 'radio radio-primary ml-1', checked: @maps['distance_unit'] == 'mi' %>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-base-100 p-5 rounded-lg shadow-sm">
|
||||
<h3 class="font-semibold mb-2">Map Preview</h3>
|
||||
<div class="h-[250px] w-full rounded-lg overflow-hidden border border-base-300">
|
||||
<div class="h-full w-full relative">
|
||||
<div style="height: 500px;">
|
||||
<div
|
||||
data-map-preview-target="mapContainer"
|
||||
class="w-full h-full rounded-lg border"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-base-100 p-5 mt-5 rounded-lg shadow-sm">
|
||||
<h3 class="font-semibold mb-4">Tile Usage (Last 7 Days)</h3>
|
||||
<div class="h-[250px]">
|
||||
<%= line_chart(
|
||||
@tile_usage,
|
||||
height: '200px',
|
||||
xtitle: 'Days',
|
||||
ytitle: 'Tiles',
|
||||
suffix: ' tiles loaded'
|
||||
) %>
|
||||
</div>
|
||||
<div class="mt-4 text-sm text-base-content/70">
|
||||
<p>Total usage this week: <span class="font-semibold"><%= @tile_usage.sum { |_, count| count } %> tiles</span>
|
||||
</p>
|
||||
<!--p>Monthly quota: <span class="font-semibold">100,000 tiles</span-->
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-control my-2">
|
||||
<%= f.label :url, 'URL' %>
|
||||
<%= f.text_field :url,
|
||||
value: @maps['url'],
|
||||
autocomplete: "off",
|
||||
placeholder: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||||
class: "input input-bordered",
|
||||
data: {
|
||||
map_preview_target: "urlInput",
|
||||
action: "input->map-preview#updatePreview"
|
||||
} %>
|
||||
<div class="card-actions justify-end mt-6">
|
||||
<%= f.submit 'Save changes', class: "btn btn-primary", data: { map_preview_target: "saveButton" } %>
|
||||
</div>
|
||||
|
||||
<%= f.submit 'Save', class: "btn btn-primary", data: { map_preview_target: "saveButton" } %>
|
||||
<% end %>
|
||||
|
||||
<h2 class="text-lg font-bold">Tile usage</h2>
|
||||
|
||||
<%= line_chart(
|
||||
@tile_usage,
|
||||
height: '200px',
|
||||
xtitle: 'Days',
|
||||
ytitle: 'Tiles',
|
||||
suffix: ' tiles loaded'
|
||||
) %>
|
||||
</div>
|
||||
|
||||
<div style="height: 500px;">
|
||||
<div
|
||||
data-map-preview-target="mapContainer"
|
||||
class="w-full h-full rounded-lg border"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<% content_for :title, 'Users' %>
|
||||
|
||||
<div class="min-h-content w-full">
|
||||
<div class="min-h-content w-full my-5">
|
||||
<h1 class="text-3xl font-bold mb-6">Users management</h1>
|
||||
<%= render 'settings/navigation' %>
|
||||
|
||||
<div class="flex flex-col lg:flex-row w-full my-10 space-x-4">
|
||||
|
|
|
|||
Loading…
Reference in a new issue