songtianlun
98a335100b
- Renamed `app/views/cities/_map.html.erb` to `app/views/shared/_map.html.erb` - Updated references to the map partial in `cities/show.html.erb` and `weather_arts/show.html.erb` - Adjusted the layout in `cities/show.html.erb` and `weather_arts/show.html.erb` for visual consistency. This refactoring improves code reusability and maintainability by centralizing the map component. It also improves the visual presentation of the application.
99 lines
3.9 KiB
Plaintext
99 lines
3.9 KiB
Plaintext
<div class="min-h-screen bg-base-100">
|
|
<!-- 页面标题和背景 -->
|
|
<div class="relative">
|
|
<!-- 背景图像和渐变 -->
|
|
<% if @city.latest_weather_art&.image&.attached? %>
|
|
<div class="absolute inset-0 h-[60vh] overflow-hidden">
|
|
<%= image_tag @city.latest_weather_art.webp_image.processed,
|
|
class: "w-full h-full object-cover object-center" %>
|
|
<div class="absolute inset-0 bg-gradient-to-b from-base-100/40 via-base-100/80 to-base-100"></div>
|
|
</div>
|
|
<% end %>
|
|
|
|
<div class="relative max-w-6xl mx-auto px-4 pt-4 ">
|
|
<%= link_to cities_path,
|
|
class: "inline-flex items-center btn btn-ghost gap-2 " do %>
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
|
</svg>
|
|
Back to Cities
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="relative pt-8 pb-8">
|
|
<div class="container mx-auto px-4">
|
|
|
|
<div class="max-w-6xl mx-auto text-center space-y-6">
|
|
<h1 class="text-5xl md:text-6xl font-display font-bold leading-tight">
|
|
<%= @city.localized_name %>
|
|
</h1>
|
|
|
|
<div class="flex flex-wrap justify-center items-center gap-3">
|
|
<div class="badge badge-lg badge-primary gap-2">
|
|
<%= "#{@city&.country&.emoji + " " || ""}#{@city&.country&.name}" %>
|
|
</div>
|
|
<div class="badge badge-lg badge-secondary gap-2">
|
|
<%= @city&.state&.name %>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 主要统计信息 -->
|
|
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 mt-8">
|
|
<%= render partial: 'cities/stat_card', collection: [
|
|
{
|
|
icon: 'temperature',
|
|
title: 'Latest Weather',
|
|
value: "#{@city.latest_weather_art&.temperature}°C",
|
|
desc: @city.latest_weather_art&.description
|
|
},
|
|
{
|
|
icon: 'location',
|
|
title: 'Coordinates',
|
|
value: "#{@city.latitude}°N, #{@city.longitude}°E",
|
|
desc: 'Geographical Location'
|
|
},
|
|
{
|
|
icon: 'history',
|
|
title: 'Records',
|
|
value: @city.weather_arts.count,
|
|
desc: 'Total Weather Arts'
|
|
}
|
|
], as: :stat %>
|
|
</div>
|
|
|
|
<div class="card bg-base-100 backdrop-blur-md shadow-lg border border-primary/20 overflow-hidden"> <!-- 调整透明度和阴影 -->
|
|
<%= render 'shared/map', city: @city %>
|
|
</div>
|
|
|
|
<%= render 'cities/admin_panel' %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 天气艺术历史记录 -->
|
|
<div class="bg-base-100">
|
|
<div class="container mx-auto px-4 py-8">
|
|
<div class="max-w-6xl mx-auto space-y-8">
|
|
<!-- 标题和更新时间 -->
|
|
<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
|
|
<h2 class="text-3xl font-display font-bold">Weather Art History</h2>
|
|
<div class="card bg-base-100 p-4">
|
|
<div class="flex items-center gap-2">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-primary" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
|
|
</svg>
|
|
<span>Last Updated: <%= time_ago_in_words(@city.last_weather_fetch) if @city.last_weather_fetch %></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 天气艺术卡片网格 -->
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
<%= render partial: 'weather_arts/card', collection: @arts, as: :weather_art %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|