reordenar articulos arrastrando y soltando
This commit is contained in:
parent
c8bf7eba21
commit
b0cffa9cfb
9 changed files with 112 additions and 76 deletions
3
app/assets/images/arrows-alt-v.svg
Normal file
3
app/assets/images/arrows-alt-v.svg
Normal file
|
@ -0,0 +1,3 @@
|
|||
<!-- CC BY 4.0 License (https://creativecommons.org/licenses/by/4.0/
|
||||
https://github.com/FortAwesome/Font-Awesome/blob/master/svgs/solid/arrows-alt-v.svg -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 512"><path d="M214.059 377.941H168V134.059h46.059c21.382 0 32.09-25.851 16.971-40.971L144.971 7.029c-9.373-9.373-24.568-9.373-33.941 0L24.971 93.088c-15.119 15.119-4.411 40.971 16.971 40.971H88v243.882H41.941c-21.382 0-32.09 25.851-16.971 40.971l86.059 86.059c9.373 9.373 24.568 9.373 33.941 0l86.059-86.059c15.12-15.119 4.412-40.971-16.97-40.971z"/></svg>
|
After Width: | Height: | Size: 571 B |
|
@ -2,4 +2,5 @@
|
|||
//= require turbolinks
|
||||
//= require zepto/dist/zepto.min.js
|
||||
//= require input-tag/input-tag.js
|
||||
//= require table-dragger/dist/table-dragger
|
||||
//= require_tree .
|
||||
|
|
16
app/assets/javascripts/order.js
Normal file
16
app/assets/javascripts/order.js
Normal file
|
@ -0,0 +1,16 @@
|
|||
$(document).on('turbolinks:load', function() {
|
||||
var table = document.querySelector('.table-draggable');
|
||||
|
||||
if (table == null) return;
|
||||
|
||||
tableDragger(table, {
|
||||
mode: 'row',
|
||||
onlyBody: true,
|
||||
dragHandler: '.handle'
|
||||
}).on('drop', function(from, to, el, mode) {
|
||||
// TODO: Detenerse al llegar al elemento que se movió
|
||||
$('.reorder').val(function(i,v) { return i; });
|
||||
|
||||
$('.submit-reorder').removeClass('d-none');
|
||||
});
|
||||
});
|
|
@ -235,3 +235,9 @@ svg {
|
|||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.handle {
|
||||
img {
|
||||
height: 1rem;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -25,42 +25,49 @@
|
|||
- if @posts.present?
|
||||
.row
|
||||
.col
|
||||
%table.table.table-condensed
|
||||
%tbody
|
||||
- @posts.each do |post|
|
||||
- next unless policy(post).show?
|
||||
-#
|
||||
saltearse el post a menos que esté en la categoría por
|
||||
la que estamos filtrando
|
||||
- if @category
|
||||
- next unless post.attributes.include? :categories
|
||||
- next unless post.categories.value.include?(@category)
|
||||
%tr
|
||||
%td
|
||||
= link_to post.title.value,
|
||||
site_post_path(@site, post.id)
|
||||
- if post.attributes.include? :draft
|
||||
- if post.draft.value
|
||||
%span.badge.badge-primary
|
||||
= post_label_t(:draft, post: post)
|
||||
- if post.attributes.include? :categories
|
||||
- unless post.categories.value.empty?
|
||||
%br
|
||||
%small
|
||||
- post.categories.value.each do |c|
|
||||
= link_to c, site_posts_path(@site, category: c)
|
||||
= form_tag site_posts_reorder_path, method: :post do
|
||||
= submit_tag t('posts.reorder'), class: 'btn submit-reorder d-none'
|
||||
-# TODO: Permitir cambiar el idioma
|
||||
%table.table.table-condensed.table-draggable
|
||||
%tbody
|
||||
- @posts.each_with_index do |post, i|
|
||||
- next unless policy(post).show?
|
||||
-#
|
||||
saltearse el post a menos que esté en la categoría por
|
||||
la que estamos filtrando
|
||||
- if @category
|
||||
- next unless post.attributes.include? :categories
|
||||
- next unless post.categories.value.include?(@category)
|
||||
%tr
|
||||
%td
|
||||
.handle
|
||||
= image_tag 'arrows-alt-v.svg'
|
||||
= hidden_field 'post[reorder]', '', value: i, class: 'reorder'
|
||||
%td
|
||||
= link_to post.title.value,
|
||||
site_post_path(@site, post.id)
|
||||
- if post.attributes.include? :draft
|
||||
- if post.draft.value
|
||||
%span.badge.badge-primary
|
||||
= post_label_t(:draft, post: post)
|
||||
- if post.attributes.include? :categories
|
||||
- unless post.categories.value.empty?
|
||||
%br
|
||||
%small
|
||||
- post.categories.value.each do |c|
|
||||
= link_to c, site_posts_path(@site, category: c)
|
||||
|
||||
%td= post.date.value.strftime('%F')
|
||||
%td
|
||||
- if policy(post).edit?
|
||||
= link_to t('posts.edit'),
|
||||
edit_site_post_path(@site, post.id),
|
||||
class: 'btn'
|
||||
- if policy(post).destroy?
|
||||
= link_to t('posts.destroy'),
|
||||
site_post_path(@site, post.id),
|
||||
class: 'btn',
|
||||
method: :delete,
|
||||
data: { confirm: t('posts.confirm_destroy') }
|
||||
%td= post.date.value.strftime('%F')
|
||||
%td
|
||||
- if policy(post).edit?
|
||||
= link_to t('posts.edit'),
|
||||
edit_site_post_path(@site, post.id),
|
||||
class: 'btn'
|
||||
- if policy(post).destroy?
|
||||
= link_to t('posts.destroy'),
|
||||
site_post_path(@site, post.id),
|
||||
class: 'btn',
|
||||
method: :delete,
|
||||
data: { confirm: t('posts.confirm_destroy') }
|
||||
- else
|
||||
%h2= t('posts.none')
|
||||
|
|
|
@ -347,7 +347,7 @@ en:
|
|||
required:
|
||||
label: ' (required)'
|
||||
feedback: 'This field cannot be empty!'
|
||||
reorder_posts: 'Reorder posts'
|
||||
reorder: 'Reorder posts'
|
||||
sort:
|
||||
by: 'Sort by'
|
||||
order: 'order'
|
||||
|
|
|
@ -357,7 +357,7 @@ es:
|
|||
required:
|
||||
label: ' (requerido)'
|
||||
feedback: '¡Este campo no puede estar vacío!'
|
||||
reorder_posts: 'Reordenar artículos'
|
||||
reorder: 'Reordenar artículos'
|
||||
sort:
|
||||
by: 'Ordenar por'
|
||||
order: 'posición'
|
||||
|
@ -366,7 +366,7 @@ es:
|
|||
content: 'Cuerpo del artículo'
|
||||
categories: 'Todos'
|
||||
dropdown: 'Desplegar el menú'
|
||||
new: 'Empezar un artículo nuevo'
|
||||
new: 'Crear artículo'
|
||||
new_with_template: 'Comenzar %{template}'
|
||||
index: 'Artículos'
|
||||
edit: 'Editar'
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
"@rails/webpacker": "^4.0.7",
|
||||
"commonmark": "^0.29.0",
|
||||
"input-tag": "https://0xacab.org/sutty/input-tag.git",
|
||||
"table-dragger": "^1.0.2",
|
||||
"table-dragger": "https://0xacab.org/sutty/table-dragger.git",
|
||||
"trix": "https://0xacab.org/sutty/trix.git",
|
||||
"zepto": "^1.2.0"
|
||||
},
|
||||
|
|
75
yarn.lock
75
yarn.lock
|
@ -579,6 +579,14 @@
|
|||
"@babel/helper-regex" "^7.4.4"
|
||||
regexpu-core "^4.5.4"
|
||||
|
||||
"@babel/polyfill@^7.4.0":
|
||||
version "7.7.0"
|
||||
resolved "https://registry.yarnpkg.com/@babel/polyfill/-/polyfill-7.7.0.tgz#e1066e251e17606ec7908b05617f9b7f8180d8f3"
|
||||
integrity sha512-/TS23MVvo34dFmf8mwCisCbWGrfhbiWZSwBo6HkADTBhUa2Q/jWltyY/tpofz/b6/RIhqaqQcquptCirqIhOaQ==
|
||||
dependencies:
|
||||
core-js "^2.6.5"
|
||||
regenerator-runtime "^0.13.2"
|
||||
|
||||
"@babel/preset-env@^7.4.5":
|
||||
version "7.5.5"
|
||||
resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.5.5.tgz#bc470b53acaa48df4b8db24a570d6da1fef53c9a"
|
||||
|
@ -1199,13 +1207,6 @@ babel-plugin-macros@^2.5.0:
|
|||
cosmiconfig "^5.2.0"
|
||||
resolve "^1.10.0"
|
||||
|
||||
babel-runtime@^6.20.0:
|
||||
version "6.26.0"
|
||||
resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
|
||||
dependencies:
|
||||
core-js "^2.4.0"
|
||||
regenerator-runtime "^0.11.0"
|
||||
|
||||
balanced-match@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
|
||||
|
@ -1882,9 +1883,15 @@ core-js-compat@^3.1.1:
|
|||
browserslist "^4.6.6"
|
||||
semver "^6.3.0"
|
||||
|
||||
core-js@^2.4.0:
|
||||
version "2.5.5"
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.5.5.tgz#b14dde936c640c0579a6b50cabcc132dd6127e3b"
|
||||
core-js@^2.6.5:
|
||||
version "2.6.10"
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.10.tgz#8a5b8391f8cc7013da703411ce5b585706300d7f"
|
||||
integrity sha512-I39t74+4t+zau64EN1fE5v2W31Adtc/REhzWN+gWRRXg6WH5qAsZm62DHpQ1+Yhe4047T55jvzz7MUqF/dBBlA==
|
||||
|
||||
core-js@^3.0.1:
|
||||
version "3.3.6"
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.3.6.tgz#6ad1650323c441f45379e176ed175c0d021eac92"
|
||||
integrity sha512-u4oM8SHwmDuh5mWZdDg9UwNVq5s1uqq6ZDLLIs07VY+VJU91i3h4f3K/pgFvtUQPGdeStrZ+odKyfyt4EnKHfA==
|
||||
|
||||
core-js@^3.1.3:
|
||||
version "3.2.1"
|
||||
|
@ -1962,12 +1969,6 @@ crossvent@1.5.4:
|
|||
dependencies:
|
||||
custom-event "1.0.0"
|
||||
|
||||
crossvent@^1.5.5:
|
||||
version "1.5.5"
|
||||
resolved "https://registry.yarnpkg.com/crossvent/-/crossvent-1.5.5.tgz#ad20878e4921e9be73d9d6976f8b2ecd0f71a0b1"
|
||||
dependencies:
|
||||
custom-event "^1.0.0"
|
||||
|
||||
crypto-browserify@^3.11.0:
|
||||
version "3.12.0"
|
||||
resolved "https://registry.yarnpkg.com/crypto-browserify/-/crypto-browserify-3.12.0.tgz#396cf9f3137f03e4b8e532c58f698254e00f80ec"
|
||||
|
@ -2179,10 +2180,6 @@ custom-event@1.0.0:
|
|||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/custom-event/-/custom-event-1.0.0.tgz#2e4628be19dc4b214b5c02630c5971e811618062"
|
||||
|
||||
custom-event@^1.0.0:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/custom-event/-/custom-event-1.0.1.tgz#5d02a46850adf1b4a317946a3928fccb5bfd0425"
|
||||
|
||||
cyclist@~0.2.2:
|
||||
version "0.2.2"
|
||||
resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-0.2.2.tgz#1b33792e11e914a2fd6d6ed6447464444e5fa640"
|
||||
|
@ -2408,9 +2405,10 @@ dot-prop@^4.1.1:
|
|||
dependencies:
|
||||
is-obj "^1.0.0"
|
||||
|
||||
dragula-with-animation@^3.7.2:
|
||||
dragula@^3.7.0:
|
||||
version "3.7.2"
|
||||
resolved "https://registry.yarnpkg.com/dragula-with-animation/-/dragula-with-animation-3.7.2.tgz#9b992db2a274324325c70bb0cb752e77e1faa8af"
|
||||
resolved "https://registry.yarnpkg.com/dragula/-/dragula-3.7.2.tgz#4a35c9d3981ffac1a949c29ca7285058e87393ce"
|
||||
integrity sha1-SjXJ05gf+sGpScKcpyhQWOhzk84=
|
||||
dependencies:
|
||||
contra "1.9.4"
|
||||
crossvent "1.5.4"
|
||||
|
@ -5696,6 +5694,11 @@ querystringify@^2.1.1:
|
|||
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.1.1.tgz#60e5a5fd64a7f8bfa4d2ab2ed6fdf4c85bad154e"
|
||||
integrity sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==
|
||||
|
||||
ramda@^0.26.1:
|
||||
version "0.26.1"
|
||||
resolved "https://registry.yarnpkg.com/ramda/-/ramda-0.26.1.tgz#8d41351eb8111c55353617fc3bbffad8e4d35d06"
|
||||
integrity sha512-hLWjpy7EnsDBb0p+Z3B7rPi3GDeRG5ZtiI33kJhTt+ORCd38AbAIjB/9zRIUoeTbE/AVX5ZkU7m6bznsvrf8eQ==
|
||||
|
||||
randombytes@^2.0.0, randombytes@^2.0.1, randombytes@^2.0.5:
|
||||
version "2.1.0"
|
||||
resolved "https://registry.yarnpkg.com/randombytes/-/randombytes-2.1.0.tgz#df6f84372f0270dc65cdf6291349ab7a473d4f2a"
|
||||
|
@ -5811,10 +5814,6 @@ regenerate@^1.4.0:
|
|||
resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.0.tgz#4a856ec4b56e4077c557589cae85e7a4c8869a11"
|
||||
integrity sha512-1G6jJVDWrt0rK99kBjvEtziZNCICAuvIPkSiUFIQxVP06RCVpq3dmDo2oi6ABpYaDYaTRr67BEhL8r1wgEZZKg==
|
||||
|
||||
regenerator-runtime@^0.11.0:
|
||||
version "0.11.1"
|
||||
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
|
||||
|
||||
regenerator-runtime@^0.13.2:
|
||||
version "0.13.3"
|
||||
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.3.tgz#7cf6a77d8f5c6f60eb73c5fc1955b2ceb01e6bf5"
|
||||
|
@ -6013,9 +6012,12 @@ run-queue@^1.0.0, run-queue@^1.0.3:
|
|||
dependencies:
|
||||
aproba "^1.1.1"
|
||||
|
||||
rx@^4.1.0:
|
||||
version "4.1.0"
|
||||
resolved "https://registry.yarnpkg.com/rx/-/rx-4.1.0.tgz#a5f13ff79ef3b740fe30aa803fb09f98805d4782"
|
||||
rxjs@^6.5.2:
|
||||
version "6.5.3"
|
||||
resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.5.3.tgz#510e26317f4db91a7eb1de77d9dd9ba0a4899a3a"
|
||||
integrity sha512-wuYsAYYFdWTAnAaPoKGNhfpWwKZbJW+HgAJ+mImp+Epl7BG8oNWBCTyRM8gba9k4lk8BgWdoYm21Mo/RYhhbgA==
|
||||
dependencies:
|
||||
tslib "^1.9.0"
|
||||
|
||||
safe-buffer@5.1.2, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
|
||||
version "5.1.2"
|
||||
|
@ -6622,14 +6624,15 @@ svgo@^1.0.0:
|
|||
unquote "~1.1.1"
|
||||
util.promisify "~1.0.0"
|
||||
|
||||
table-dragger@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/table-dragger/-/table-dragger-1.0.2.tgz#981f46c62fd2899b3fc5e644055ea72831949707"
|
||||
"table-dragger@https://0xacab.org/sutty/table-dragger.git":
|
||||
version "2.0.2"
|
||||
resolved "https://0xacab.org/sutty/table-dragger.git#a5199975398dca9b3a849f5d56220fd11e68733c"
|
||||
dependencies:
|
||||
babel-runtime "^6.20.0"
|
||||
crossvent "^1.5.5"
|
||||
dragula-with-animation "^3.7.2"
|
||||
rx "^4.1.0"
|
||||
"@babel/polyfill" "^7.4.0"
|
||||
core-js "^3.0.1"
|
||||
dragula "^3.7.0"
|
||||
ramda "^0.26.1"
|
||||
rxjs "^6.5.2"
|
||||
|
||||
tapable@^1.0.0, tapable@^1.1.3:
|
||||
version "1.1.3"
|
||||
|
|
Loading…
Reference in a new issue