mirror of
https://0xacab.org/sutty/sutty
synced 2024-11-23 04:06:21 +00:00
feat: relación de 1:n
This commit is contained in:
parent
c780466c7b
commit
1e413e57f5
3 changed files with 54 additions and 0 deletions
4
app/models/metadata_new_has_many.rb
Normal file
4
app/models/metadata_new_has_many.rb
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
# frozen_string_literal: true
|
||||||
|
|
||||||
|
# Interfaz nueva para uno a muchos
|
||||||
|
class MetadataNewHasMany < MetadataHasMany; end
|
6
app/views/posts/attribute_ro/_new_has_many.haml
Normal file
6
app/views/posts/attribute_ro/_new_has_many.haml
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
%tr{ id: attribute }
|
||||||
|
%th= post_label_t(attribute, post: post)
|
||||||
|
%td
|
||||||
|
%ul{ dir: dir, lang: locale }
|
||||||
|
- metadata.has_many.each do |p|
|
||||||
|
%li= link_to p.title.value, site_post_path(site, p.id)
|
44
app/views/posts/attributes/_new_has_many.haml
Normal file
44
app/views/posts/attributes/_new_has_many.haml
Normal file
|
@ -0,0 +1,44 @@
|
||||||
|
-#
|
||||||
|
Genera un listado de checkboxes entre los que se puede elegir para guardar
|
||||||
|
:ruby
|
||||||
|
id = "#{base}_#{attribute}"
|
||||||
|
name = "#{base}[#{attribute}][]"
|
||||||
|
form_id = "form-#{Nanoid.generate}"
|
||||||
|
|
||||||
|
%div{ data: { controller: 'modal array', 'array-original-value': metadata.value.to_json, 'array-new-array-value': site_posts_new_array_value_path(site) } }
|
||||||
|
.form-group
|
||||||
|
= hidden_field_tag name, ''
|
||||||
|
= label_tag id, post_label_t(attribute, post: post)
|
||||||
|
-# Mostramos la lista de valores actuales.
|
||||||
|
|
||||||
|
Al aceptar el modal, se vacía el listado y se completa en base a
|
||||||
|
renderizaciones con HTMX. Para poder hacer eso, tenemos que poder
|
||||||
|
acceder a todos los items dentro del modal (como array.item) y
|
||||||
|
enviar el valor al endpoint que devuelve uno por uno. Esto lo
|
||||||
|
tenemos disponible en Stimulus, pero queremos usar HTMX o técnica
|
||||||
|
similar para poder renderizar del lado del servidor.
|
||||||
|
|
||||||
|
Para poder cancelar, mantenemos el estado original y desactivamos
|
||||||
|
o activamos los ítemes según estén incluidos en esa lista o no.
|
||||||
|
.row.row-cols-1.row-cols-md-2{ data: { target: 'array.current' } }
|
||||||
|
- metadata.values.slice(*metadata.value).each do |value|
|
||||||
|
= render 'posts/new_array_value', value: value
|
||||||
|
|
||||||
|
= render 'bootstrap/btn', content: t('.edit'), action: 'modal#show'
|
||||||
|
|
||||||
|
= render 'bootstrap/modal', id: id, modal_content_attributes: { class: 'h-100' }, hide_actions: ['array#cancel'] do
|
||||||
|
- content_for :"#{id}_header" do
|
||||||
|
.form-group.flex-grow-1.mb-0
|
||||||
|
= label_tag id, post_label_t(attribute, post: post)
|
||||||
|
%input.form-control{ data: { target: 'array.search', action: 'input->array#search' }, type: 'search', placeholder: t('.filter') }
|
||||||
|
|
||||||
|
- content_for :"#{id}_body" do
|
||||||
|
.form-group.mb-0{ id: "#{id}_body" }
|
||||||
|
- metadata.values.each_pair do |value, key|
|
||||||
|
.mb-2{ data: { target: 'array.item', 'searchable-value': value.remove_diacritics.downcase, value: value } }
|
||||||
|
= render 'bootstrap/custom_checkbox', name: name, id: "value-#{Nanoid.generate}", value: key, checked: metadata.value.include?(key), content: value
|
||||||
|
|
||||||
|
- content_for :"#{id}_footer" do
|
||||||
|
.flex-grow-1
|
||||||
|
= render 'bootstrap/btn', content: t('.accept'), action: 'array#accept modal#hide', class: 'm-0 mr-1'
|
||||||
|
= render 'bootstrap/btn', content: t('.cancel'), action: 'array#cancel modal#hide', class: 'm-0'
|
Loading…
Reference in a new issue