रत्न the_sortable_tree

TheSortableTree - एक मणि जो भयानक_nested_set या nested_set रत्नों के आधार पर बनाए गए पेड़ों के लिए ड्रैग एंड ड्रॉप कार्यक्षमता को लागू करता है।



2008 में, जब हमने रेल पर अपना पहला सामाजिक कार्यक्रम बनाया, तब मैंने पहली बार बेहतर_निवेशित_सेट मणि का सामना किया। मणि सुंदर था (मेरा मतलब है, वास्तव में, कोड द्वारा नहीं, कार्यान्वयन अभी भी लंगड़ा था) और, शायद, यह अकेले मुझे बुरे सपने की तरह, PHP में प्रोग्रामिंग को भूल जाने के लिए मनाने के लिए पर्याप्त था।

हमने एक बहु-स्तरीय टिप्पणी पेड़ बनाने के लिए मणि का उपयोग किया। लेकिन एक बात थी लेकिन ... उस पल में एक भी सहायक नहीं था जो इन पेड़ों को खींच सके। इस वजह से मुझे अपनी बाइक्स का आविष्कार करना पड़ा। मैंने अपनी बाइक भी बनाई।

नहीं, मैं कार्यान्वयन प्रक्रिया को नाटकीय बनाने और जटिल करने के लिए इच्छुक नहीं हूं। हम में से प्रत्येक की अपनी प्राथमिकताएँ हैं। तो मैंने सबसे आम पुनरावृत्ति की, जो पार्शल्स का उपयोग करके एक पेड़ खींचता है।

हां, उन्होंने मेरी आलोचना की - यह धीरे-धीरे खींचा जा रहा है, यह 10,000 तत्वों के पेड़ पर काम नहीं करेगा, इसे अलग-अलग (सामान्य ...

हालांकि, 2008 के बाद से, मैंने कुछ और नहीं देखा है, अधिक सस्ती, तेज और सरल। शायद मैं बुरी तरह से देख रहा था।

और इसलिए, नीचे देखा और अपने हाथों में एक रूमाल को उँगलियों से दबाते हुए, मैं आपके लिए रेल इंजन के आधार पर एक मणि के रूप में अपने सहायक का पुनर्जन्म प्रस्तुत करता हूं।

मुझे यकीन है कि छोटे पेड़ों (100 तत्वों तक) को खींचने और छोटे सीएमएस बनाने के लिए जहां आप पेड़ को एक सरल ड्रैग और ड्रॉप के साथ प्रबंधित करना चाहते हैं, मेरा सहायक सही है।

https://github.com/the-teacher/the_sortable_tree



वर्तमान में दो प्रतिपादन विकल्प हैं:

1. छंटनी का पेड़ (प्रशासनिक इंटरफ़ेस)
2. सादा पेड़ (यूजर इंटरफेस)

यह वह है जो एक पेड़ उपयोगकर्ता के लिए दिखता है



मणि स्थापित करना और इसका उपयोग करना शुरू करना बहुत सरल है।

अपना रत्न पूरा करें। हम HAML की आवश्यकता होगी, बहुत बढ़िया नेस्टेड सेट, और the_sortable_tree प्रतिपादन सहायक।

gem 'haml' gem 'awesome_nested_set' # gem 'nested_set' gem 'the_sortable_tree' 

मैंने विशेष रूप से एचएएमएल पर कड़ी निर्भरता को हटा दिया, ताकि ईआरबी या एसएलआईएम प्रशंसक सहायक का भी उपयोग कर सकें, लेकिन आप लोगों को खुद को एचएमएल से विचारों को बदलना होगा।

जांचें कि सभी जेएस लाइब्रेरी जुड़े हुए हैं

एप्लिकेशन / संपत्ति / javascripts / application.js

 //= require jquery //= require jquery-ui //= require jquery_ujs 

उदाहरण के रूप में पेज मॉडल का उपयोग करके एक मणि का उपयोग करने पर विचार करें।

मॉडल में ओस्प्रे जोड़ें

 class Page < ActiveRecord::Base acts_as_nested_set include TheSortableTree::Scopes end 

नियंत्रक में एक ट्री पुनर्निर्माण फ़ंक्शन जोड़ें

 class PagesController < ApplicationController include TheSortableTreeController::Rebuild end 

यदि आप एक रिवर्स ट्री का उपयोग करते हैं (कभी-कभी एक उल्टे पेड़ की आवश्यकता होती है, उदाहरण के लिए, समाचार की सूची बनाने के लिए), तो एक अलग समावेश का उपयोग करें।

 class PagesController < ApplicationController include TheSortableTreeController::ReversedRebuild end 

मार्गों को पूरा करें।

हमें पेड़ को प्रदर्शित करने के लिए एक कार्रवाई की आवश्यकता है। जिसे आप कहते हैं, वह महत्वपूर्ण नहीं है। मेरे पास यह है : प्रबंधित करें

पुनर्निर्माण - एक विधि जो एक पेड़ की वस्तु को एक स्थिति से दूसरे स्थान पर ले जाती है। इस विधि को हीम में सीवन किया जाता है - यह आवश्यक है।

 resources :pages do collection do get :manage post :rebuild end end 

कंट्रोलर कोड खत्म करें।

पूरे पेड़ को प्राप्त करें (प्रत्यक्ष नमूनाकरण आदेश)

 class PagesController < ApplicationController include TheSortableTreeController::Rebuild def manage @pages = Page.nested_set.all end end 

रिवर्स सैंपलिंग ऑर्डर

 class PagesController < ApplicationController include TheSortableTreeController::ReversedRebuild def manage @pages = Page.reversed_nested_set.all end end 

हम कोड को दृश्य में रखकर व्यवस्थापक के लिए पेड़ खींचते हैं।

 - content_for :css do = stylesheet_link_tag 'the_sortable_tree', :media => :screen - content_for :js do = javascript_include_tag 'jquery.ui.nestedSortable' = sortable_tree @pages, :new_url => new_page_path, :max_levels => 4 

या उपयोगकर्ता के लिए एक पेड़ बनाएं।

 - content_for :css do = stylesheet_link_tag 'the_sortable_tree_min', :media => :screen = sortable_tree @pages, :new_url => new_page_path, :path => 'the_sortable_tree_min' 

Content_for: css और content_for: js के लिए काम करने के लिए, लेआउट / application.xxx में उपज (: js) और उपज (: css) जोड़ें ।

बेशक, आप जिस तरह से js और css कनेक्ट करते हैं, वह आपके ऊपर है।

वह सब है! पेड़ को प्रदर्शित और खींचा जाना चाहिए।

यदि कुछ काम नहीं करता है, तो LiveDemo को डाउनलोड करें और चलाएं।

अनुकूलन प्रदर्शन

व्यू जेनरेटर चलाएं और इसे कंट्रोलर का नाम दें।

 rails g the_sortable_tree:views pages 

उपयोगकर्ता ट्री को अनुकूलित करने के लिए, न्यूनतम पैरामीटर निर्दिष्ट करें

 rails g the_sortable_tree:views pages min 

विचारों को संपादित करें और सहायक को बताएं कि वे कहां हैं:

 = sortable_tree @pages, :new_url => new_page_path, :path => 'pages/the_sortable_tree' 

मेरा मानना ​​है कि विभिन्न मॉडलों को अलग-अलग तरीके से प्रस्तुत किया जा सकता है - इसलिए विचारों को निर्दिष्ट नियंत्रक के विचारों के फ़ोल्डर में कॉपी किया जाता है।

मुझे उम्मीद है कि यह किसी के लिए उपयोगी है।

https://github.com/the-teacher/the_sortable_tree

पुनश्च: यदि आपको स्पेलिंग या सिंटैक्स त्रुटि, कोड में कोई त्रुटि या कोई अन्य त्रुटि दिखाई देती है, तो कृपया मुझे पीएम में बताएं, मैं आपका बहुत आभारी रहूंगा। अग्रिम धन्यवाद!