Change order page.

Fix bug.
This commit is contained in:
BoHung Chiu 2021-10-12 21:41:30 +08:00
parent 4983a26ae5
commit afd6ff8612
2 changed files with 98 additions and 18 deletions

View File

@ -1,21 +1,36 @@
<% content_for :page_specific_css do %> <% content_for :page_specific_css do %>
<%= stylesheet_link_tag "admin/web_links" %> <%= stylesheet_link_tag "admin/web_links" %>
<% end %> <% end %>
<style>
.icons-list-2 {
cursor: all-scroll;
}
.position-text-div {
cursor: text;
margin: -8px;
padding: 8px;
}
.position-text-div:hover {
background: aqua;
}
</style>
<div class="order-edit-notification"><%= t("web_link.please_save") %></div> <div class="order-edit-notification"><%= t("web_link.please_save") %></div>
<table width="100%" id="web_resource_order_table" class="table table-striped" class="web_soursce_table"> <table width="100%" id="web_resource_order_table" class="table table-striped" class="web_soursce_table">
<thead> <thead>
<tr> <tr>
<th></th>
<th><%= t("web_link.position") %></th> <th><%= t("web_link.position") %></th>
<th><%= t("web_link.link") %></th> <th><%= t("web_link.link") %></th>
</thead> </thead>
<tbody> <tbody>
<% @links.each_with_index do |link,i| %> <% @links.each_with_index do |link,i| %>
<tr> <tr data-index="<%=i%>">
<td><span class="brand"><i class="icons-list-2"></i></span></td>
<td class="position-text"> <td class="position-text">
<div class="position-text-div" data-value="<%= (i + 1).to_s %>"><%= (i + 1).to_s %></div> <div class="position-text-div" data-value="<%= (i + 1).to_s %>"><%= (i + 1).to_s %></div>
</td> </td>
<td> <td>
<div class="link-text-id" data-link-id="<%= link.id.to_s %>"><%= link.title %></div> <div class="link-text-id" data-link-id="<%= link.id.to_s %>"><%= link.title.html_safe %></div>
</td> </td>
</tr> </tr>
<% end %> <% end %>
@ -74,10 +89,10 @@
allRows = table_element.rows; allRows = table_element.rows;
for(i = 1; i < allRows.length; i++){ for(i = 1; i < allRows.length; i++){
var thisRow = allRows[i], var thisRow = allRows[i],
text = thisRow.cells[0].textContent.trim(), text = thisRow.cells[1].textContent.trim(),
hash = {}; hash = {};
hash.index = parseInt(text); hash.index = parseInt(text);
text = thisRow.cells[1].innerHTML.trim(); text = thisRow.cells[2].innerHTML.trim();
if(text != "&nbsp;"){ if(text != "&nbsp;"){
hash.link = text; hash.link = text;
} }
@ -92,8 +107,8 @@
for(i = 0;i < data.length; i++){ for(i = 0;i < data.length; i++){
var thisRow = allRows[i + 1], var thisRow = allRows[i + 1],
current_value = i + 1; current_value = i + 1;
thisRow.cells[0].innerHTML = "<div class='position-text-div' data-value='" + current_value + "'>" + current_value + "</div>"; thisRow.cells[1].innerHTML = "<div class='position-text-div' data-value='" + current_value + "'>" + current_value + "</div>";
thisRow.cells[1].innerHTML = data[i].link; thisRow.cells[2].innerHTML = data[i].link;
} }
$("#web_resource_order_table div.position-text-div").on("click",makeEditable); $("#web_resource_order_table div.position-text-div").on("click",makeEditable);
} }
@ -120,3 +135,65 @@
$("#web_resource_order_table div.position-text-div").on("click",makeEditable); $("#web_resource_order_table div.position-text-div").on("click",makeEditable);
</script> </script>
<script>
var th_width = {};
$(document).ready(function(){
$( ".table tbody" ).each(function(i,tbody){
var table = $(tbody).parents("table").eq(0);
table.data("index",i);
th_width[i] = [];
table.find("thead th").each(function(j,th){
th_width[i].push($(th).outerWidth(true));
})
})
$( ".table tbody" ).sortable({
revert: true,
axis: "y",
handle: ".brand",
start: function(event, ui){
var item = ui.item;
var target = $(event.target);
var index = target.parents(".table").eq(0).data("index");
item.css("width",target.width());
item.find("td").each(function(i,td){
$(td).width(th_width[index][i]);
})
},
stop: function(event, ui) {
var item = ui.item;
item.css("width","");
item.find("td").css("width","");
},
update: function(event, ui) {
var item = ui.item;
var org_index = item.data("index");
console.log(org_index);
var new_index = item.index();
var indices = [org_index,new_index].sort();
var table = item.parents(".table").eq(0);
table.find("tbody tr").each(function(i,tr){
if(i >= indices[0] && i <= indices[1]){
var position_text_div = $(tr).find(".position-text-div");
position_text_div.text(i+1).data("value",i+1);
$(tr).data("index",i);
}
if(i > indices[1]){
return;
}
})
$("#save-order-button").removeClass("disabled");
$(".order-edit-notification").slideDown();
}
});
})
$(window).resize(function(){
th_width = {};
$( ".table tbody" ).each(function(i,tbody){
var table = $(tbody).parents("table").eq(0);
th_width[i] = [];
table.find("thead th").each(function(j,th){
th_width[i].push($(th).outerWidth(true));
})
})
})
</script>

View File

@ -2,11 +2,13 @@ $:.push File.expand_path("../lib", __FILE__)
# Maintain your gem's version: # Maintain your gem's version:
require "web_resource/version" require "web_resource/version"
app_path = File.expand_path(__dir__) bundle_update_flag = ARGV[0]=='update' || ARGV[0]=='install'
template_path = ENV['PWD'] + '/app/templates' if bundle_update_flag
all_template = Dir.glob(template_path+'/*/') app_path = File.expand_path(__dir__)
puts 'copying module' template_path = ENV['PWD'] + '/app/templates'
all_template.each do |folder| all_template = Dir.glob(template_path+'/*/')
puts 'copying module'
all_template.each do |folder|
if !folder.include?('mobile') if !folder.include?('mobile')
if folder.split('/')[-1] != 'mobile' if folder.split('/')[-1] != 'mobile'
begin begin
@ -17,6 +19,7 @@ all_template.each do |folder|
end end
end end
end end
end
end end
# Describe your gem and declare its dependencies: # Describe your gem and declare its dependencies:
Gem::Specification.new do |s| Gem::Specification.new do |s|